/**
 * Admin Modern UI — Shared styles for store owner pages
 * Used across: stores, store-settings, store-orders, products, import-list,
 *              account, settings, affiliate, and related pages.
 */

/* ============================================================
   PAGE HEADERS
   ============================================================ */
.page-header,.ss-header,.il-header,.set-header,.prod-header,.stores-header,.cs-header,.cn-header,.del-header{padding:20px 0 16px}
.page-title,.ss-title,.il-title,.set-title,.prod-title,.stores-title,.cs-title,.cn-title,.del-title{font-size:22px;font-weight:700;color:#1a202c;margin:0 0 6px}
.page-sub,.il-sub,.set-sub,.prod-sub,.stores-sub,.cs-sub,.cn-sub{font-size:13px;color:#718096;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.page-back,.cs-back,.cn-back,.del-back{font-size:12px;color:#64748b;font-weight:500;text-decoration:none;display:inline-flex;align-items:center;gap:4px;margin-bottom:8px}
.page-back:hover,.cs-back:hover,.cn-back:hover,.del-back:hover{color:var(--primary,#3b82f6);text-decoration:none}

/* Store info bar (dashboard, store-settings) */
.store-bar{background:linear-gradient(135deg,#f0f4ff 0%,#e8eeff 100%);border:1px solid #d4deff;border-radius:10px;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:20px}
.store-bar .store-info{display:flex;align-items:center;gap:12px}
.store-bar .store-icon{width:38px;height:38px;border-radius:8px;background:var(--primary,#3b82f6);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px}
.store-bar .store-name{font-weight:600;font-size:14px;color:#1a202c}
.store-bar .store-url{font-size:12px;color:#718096}
.store-bar .store-actions{display:flex;gap:6px}
.store-bar .store-actions .btn{font-size:12px;padding:6px 14px;border-radius:6px;font-weight:600}

/* ============================================================
   CARDS
   ============================================================ */
.card-modern{background:#fff;border:1px solid #edf2f7;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.04);margin-bottom:20px;overflow:hidden}
.card-modern__header{padding:16px 24px;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;gap:10px}
.card-modern__header i{color:#94a3b8;font-size:14px;width:18px;text-align:center}
.card-modern__header h3{margin:0;font-size:15px;font-weight:700;color:#1e293b}
.card-modern__header p{margin:0;font-size:12px;color:#94a3b8}
.card-modern__body{padding:24px}

/* Action bar (list headers with title + button) */
.action-bar{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-bottom:1px solid #f1f5f9}
.action-bar h3{margin:0;font-size:15px;font-weight:700;color:#1e293b}
.action-bar .btn{border-radius:6px;font-weight:600;font-size:12px}

/* Save footer */
.save-footer{padding:20px 24px;border-top:1px solid #f1f5f9;display:flex;justify-content:flex-end;background:#fafbfc;border-radius:0 0 10px 10px}
.save-footer .btn{border-radius:8px;font-weight:600;font-size:13px;padding:10px 24px}

/* Divider */
.divider-modern{border:none;border-top:1px solid #f1f5f9;margin:0}

/* ============================================================
   TAB NAVIGATION (horizontal scrollable)
   ============================================================ */
.tabs-modern{display:flex;gap:4px;overflow-x:auto;border-bottom:2px solid #edf2f7;padding-bottom:0;margin-bottom:20px;scrollbar-width:none}
.tabs-modern::-webkit-scrollbar{display:none}
.tab-modern{display:flex;align-items:center;gap:6px;padding:10px 16px;font-size:13px;font-weight:600;color:#64748b;text-decoration:none;white-space:nowrap;border:none;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .2s;background:none}
.tab-modern:hover{color:#334155;text-decoration:none;background:none}
.tab-modern.active,.tabs-modern .nav-link.active{color:var(--primary,#3b82f6);border-bottom-color:var(--primary,#3b82f6);background:none}
.tab-modern i{font-size:13px;width:16px;text-align:center}

/* ============================================================
   FORMS
   ============================================================ */

/* Two-column form section (label left, fields right) */
.form-section{display:grid;grid-template-columns:260px 1fr;gap:32px;padding:24px}
@media(max-width:991px){.form-section{grid-template-columns:1fr;gap:12px}}
.form-section__left h3,.form-section__left h4{font-size:14px;font-weight:700;color:#1e293b;margin:0 0 4px}
.form-section__left p{font-size:12px;color:#94a3b8;margin:0;line-height:1.5}

/* Field */
.field-modern{margin-bottom:18px}
.field-modern:last-child{margin-bottom:0}

/* Labels */
.label-modern{display:block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:#64748b;margin-bottom:6px}
.label-modern .required{color:#ef4444;margin-left:2px}

/* Hint text */
.hint-modern{font-size:11px;color:#94a3b8;margin-top:4px;line-height:1.4}

/* Modern input styling (applied to .form-control inside .card-modern or with .input-modern) */
.input-modern,.card-modern .form-control{border-radius:8px;border-color:#e2e8f0;font-size:13px;padding:9px 14px;transition:border-color .2s,box-shadow .2s;outline:none}
.input-modern:focus,.card-modern .form-control:focus{border-color:var(--primary,#3b82f6);box-shadow:0 0 0 3px rgba(59,130,246,.08)}
.input-modern[type="color"]{height:42px;padding:4px 8px;cursor:pointer}
select.input-modern{cursor:pointer;appearance:auto}
textarea.input-modern{resize:vertical;min-height:60px}

/* Grid layouts */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:767px){.grid-2{grid-template-columns:1fr}}
.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
@media(max-width:767px){.grid-3{grid-template-columns:1fr}}

/* Switch toggle */
.switch-modern{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#f8fafc;border-radius:8px;border:1px solid #edf2f7;margin-bottom:10px}
.switch-modern:last-child{margin-bottom:0}
.switch-modern label{margin:0;font-size:13px;color:#334155;font-weight:500;cursor:pointer}

/* Color picker inline */
.color-picker-group{display:flex;align-items:center;gap:8px}
.color-picker-group input[type="color"]{width:44px;height:38px;padding:2px;border:1px solid #e2e8f0;border-radius:6px;cursor:pointer;flex-shrink:0}
.color-picker-group input[type="text"]{flex:1}

/* Image preview */
.img-preview-modern,.ss-img-preview{display:inline-block;padding:8px;background:#f8fafc;border:1px solid #edf2f7;border-radius:8px;margin-bottom:8px}
.img-preview-modern img,.ss-img-preview img{display:block;max-height:60px;max-width:200px;border-radius:4px}

/* ============================================================
   TABLES
   ============================================================ */
.table-modern{width:100%;border-collapse:separate;border-spacing:0}
.table-modern thead th{background:#f8fafc;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:#94a3b8;padding:12px 16px;border-bottom:2px solid #e2e8f0;white-space:nowrap}
.table-modern tbody td{padding:12px 16px;border-bottom:1px solid #f1f5f9;font-size:13px;color:#334155;vertical-align:middle}
.table-modern tbody tr:hover td{background:#f8fafc}
.table-modern tbody tr:last-child td{border-bottom:none}

/* Checkbox modern */
.table-modern input[type="checkbox"]{width:18px;height:18px;border-radius:4px;border:2px solid #cbd5e1;cursor:pointer;accent-color:var(--primary,#3b82f6);background:#fff}

/* ============================================================
   STATUS BADGES (extend existing status-badge system)
   ============================================================ */
/* Already defined in dashboard-modern.css or wrapper, these are safe fallbacks */

/* ============================================================
   EMPTY STATES
   ============================================================ */
.empty-modern{text-align:center;padding:48px 20px}
.empty-modern i{font-size:40px;color:#e2e8f0;margin-bottom:12px;display:block}
.empty-modern img{max-width:240px;margin-bottom:20px;opacity:.7}
.empty-modern h3{font-size:16px;font-weight:600;color:#64748b;margin-bottom:4px}
.empty-modern p{font-size:13px;color:#94a3b8;margin-bottom:16px}

/* ============================================================
   SLIDE-OVER PANEL (products page)
   ============================================================ */
.slide-overlay{position:fixed;inset:0;background:rgba(15,23,42,.4);z-index:99998;display:none;backdrop-filter:blur(2px)}
.slide-overlay.active{display:block}
.slide-panel{position:fixed;top:0;right:-480px;width:480px;max-width:100%;height:100vh;background:#fff;z-index:99999;transition:right .3s ease;box-shadow:-10px 0 30px rgba(0,0,0,.12);display:flex;flex-direction:column}
.slide-panel.active{right:0}
@media(max-width:576px){.slide-panel{width:100%}}
.slide-header{padding:16px 24px;border-bottom:1px solid #f1f5f9;display:flex;align-items:flex-start;justify-content:space-between;flex-shrink:0;background:#f8fafc}
.slide-header h3{font-size:15px;font-weight:700;color:#1e293b;margin:0;max-width:380px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.slide-close{background:none;border:none;font-size:22px;color:#94a3b8;cursor:pointer;padding:0;line-height:1}
.slide-close:hover{color:#334155}
.slide-body{flex:1;overflow-y:auto;padding:20px 24px}
.slide-footer{padding:14px 24px;border-top:1px solid #f1f5f9;display:flex;flex-direction:column;gap:6px;flex-shrink:0;background:#f8fafc}
.slide-footer .btn{border-radius:6px;font-weight:600;font-size:12px;padding:8px 14px;display:flex;align-items:center;justify-content:center;gap:6px}
.slide-section{margin-bottom:20px}
.slide-section-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#94a3b8;margin-bottom:8px}

/* ============================================================
   LOADING OVERLAY
   ============================================================ */
.lds-dual-ring.hidden{display:none}
.lds-dual-ring{display:inline-block;width:80px;height:80px}
.lds-dual-ring:after{content:" ";display:block;width:64px;height:64px;margin:20% auto;border-radius:50%;border:6px solid #fff;border-color:#fff transparent #fff transparent;animation:lds-dual-ring 1.2s linear infinite}
@keyframes lds-dual-ring{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
.overlay{position:fixed;top:0;left:0;width:100%;height:100vh;background:rgba(0,0,0,.8);z-index:999;opacity:1;transition:all .5s;display:flex;align-items:center;justify-content:center}
.overlay.hidden{display:none}
.loader{border:16px solid #f3f3f3;border-radius:50%;border-top:16px solid #3498db;width:120px;height:120px;animation:spin 2s linear infinite}
@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}

/* ============================================================
   MODAL OVERLAY (store-orders action modal)
   ============================================================ */
.so-modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:9999;display:none;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(2px)}
.so-modal-overlay.active{display:flex}
.so-modal{background:#fff;border-radius:12px;width:100%;max-width:460px;box-shadow:0 25px 50px -12px rgba(0,0,0,.25);animation:soModalIn .25s ease}
@keyframes soModalIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}

/* ============================================================
   ACCOUNT PAGES
   ============================================================ */
.acct-header{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.acct-avatar{width:56px;height:56px;border-radius:12px;object-fit:cover;border:2px solid #edf2f7}
.acct-info h2{font-size:20px;font-weight:700;color:#1e293b;margin:0 0 4px}
.acct-tabs{display:flex;gap:4px;overflow-x:auto;border-bottom:2px solid #edf2f7;padding-bottom:0;scrollbar-width:none}
.acct-tabs::-webkit-scrollbar{display:none}
.acct-tabs .acct-tab{display:flex;align-items:center;gap:6px;padding:10px 16px;font-size:13px;font-weight:600;color:#64748b;text-decoration:none;white-space:nowrap;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .2s}
.acct-tabs .acct-tab:hover{color:#334155;text-decoration:none}
.acct-tabs .acct-tab.active{color:var(--primary,#3b82f6);border-bottom-color:var(--primary,#3b82f6)}
.acct-tabs .acct-tab i{font-size:13px;width:16px;text-align:center}

/* ============================================================
   MISC UTILITIES
   ============================================================ */
.gap-4{gap:4px}.gap-6{gap:6px}.gap-8{gap:8px}.gap-10{gap:10px}.gap-12{gap:12px}.gap-16{gap:16px}

/* ============================================================
   STORE SETTINGS PAGE (ss-*)
   ============================================================ */
/* Store Settings — Vertical Sidebar Layout */
.ss-layout{display:grid;grid-template-columns:220px 1fr;gap:24px;align-items:start}
@media(max-width:991px){.ss-layout{grid-template-columns:1fr;gap:0}}

/* Sidebar — sticky, scrollable, Shopify-style */
.ss-sidebar{background:#fff;border:1px solid #edf2f7;border-radius:10px;padding:8px;position:sticky;top:20px;box-shadow:0 1px 3px rgba(0,0,0,.04);max-height:calc(100vh - 40px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#e2e8f0 transparent}
.ss-sidebar::-webkit-scrollbar{width:4px}
.ss-sidebar::-webkit-scrollbar-track{background:transparent}
.ss-sidebar::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:4px}
.ss-sidebar::-webkit-scrollbar-thumb:hover{background:#cbd5e1}

/* Store mini card at top of sidebar */
.ss-sidebar-store{display:flex;align-items:center;gap:10px;padding:12px;margin-bottom:8px;border-bottom:1px solid #f1f5f9}
.ss-sidebar-store-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;flex-shrink:0}
.ss-sidebar-store-name{font-size:13px;font-weight:700;color:#1e293b;line-height:1.2;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ss-sidebar-store-status{font-size:11px;color:#94a3b8;display:flex;align-items:center;gap:4px;margin-top:2px}
.ss-sidebar-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.ss-sidebar-dot--live{background:#10b981}
.ss-sidebar-dot--setup{background:#f59e0b}
.ss-sidebar-dot--paused{background:#94a3b8}
.ss-sidebar-dot--suspended{background:#ef4444}

/* Sidebar groups & labels */
.ss-sidebar-group{margin-bottom:4px}
.ss-sidebar-group:last-child{margin-bottom:0}
.ss-sidebar-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:#94a3b8;padding:10px 12px 4px;margin-top:4px}
.ss-sidebar-group:first-child .ss-sidebar-label{margin-top:0}

/* Nav items — left border accent on active */
.ss-nav{display:flex;align-items:center;gap:10px;padding:8px 12px;font-size:13px;font-weight:500;color:#64748b;text-decoration:none;border-radius:6px;transition:all .15s;white-space:nowrap;border-left:3px solid transparent;position:relative}
.ss-nav span{flex:1}
.ss-nav:hover{background:#f8fafc;color:#334155;text-decoration:none}
.ss-nav.active{background:#f0f4ff;color:var(--primary,#3b82f6);font-weight:600;border-left-color:var(--primary,#3b82f6)}
.ss-nav.active:hover{background:#f0f4ff;color:var(--primary,#3b82f6)}
.ss-nav.active i{color:var(--primary,#3b82f6)}
.ss-nav i{width:16px;text-align:center;font-size:13px;flex-shrink:0;color:#94a3b8;transition:color .15s}
.ss-nav:hover i{color:#64748b}

/* Nav badges (subscriber count, pending reviews) */
.ss-nav-badge{font-size:10px;font-weight:700;background:#e2e8f0;color:#64748b;padding:1px 6px;border-radius:10px;margin-left:auto;min-width:18px;text-align:center;line-height:1.5}
.ss-nav.active .ss-nav-badge{background:var(--primary,#3b82f6);color:#fff}
.ss-nav-badge--warn{background:#fef3c7;color:#d97706}
.ss-nav.active .ss-nav-badge--warn{background:#fbbf24;color:#fff}

.ss-content{min-width:0}

/* Mobile: sidebar becomes horizontal scroll */
@media(max-width:991px){
.ss-sidebar{position:static;display:flex;overflow-x:auto;border-radius:10px 10px 0 0;padding:6px;gap:2px;scrollbar-width:none;margin-bottom:-1px;max-height:none;flex-wrap:nowrap}
.ss-sidebar::-webkit-scrollbar{display:none}
.ss-sidebar-store{display:none}
.ss-sidebar-group{display:flex;gap:2px;flex-shrink:0}
.ss-sidebar-label{display:none}
.ss-nav{border-left:none;border-radius:6px;padding:8px 14px;font-size:12px}
.ss-nav.active{border-left:none;background:var(--primary,#3b82f6);color:#fff}
.ss-nav.active i{color:#fff}
.ss-nav-badge{display:none}
}

.ss-header{padding:20px 0 16px}
.ss-title{font-size:22px;font-weight:700;color:#1a202c;margin:0 0 6px}
.ss-store-bar{background:linear-gradient(135deg,#f0f4ff 0%,#e8eeff 100%);border:1px solid #d4deff;border-radius:10px;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:20px}
.ss-store-bar .store-info{display:flex;align-items:center;gap:12px}
.ss-store-bar .store-icon{width:38px;height:38px;border-radius:8px;background:var(--primary,#3b82f6);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px}
.ss-store-bar .store-name{font-weight:600;font-size:14px;color:#1a202c}
.ss-store-bar .store-url{font-size:12px;color:#718096}
.ss-store-bar .store-actions{display:flex;gap:6px}
.ss-store-bar .store-actions .btn{font-size:12px;padding:6px 14px;border-radius:6px;font-weight:600}
.setup-progress{background:#fffbeb;border:1px solid #fbbf24;border-radius:10px;padding:16px 20px;margin-bottom:20px}
.setup-progress__title{font-size:14px;font-weight:700;color:#92400e;margin-bottom:8px}
.setup-progress__bar{height:6px;background:#fde68a;border-radius:3px;overflow:hidden;margin-bottom:10px}
.setup-progress__fill{height:100%;background:#f59e0b;border-radius:3px;transition:width .3s}
.setup-progress__items{display:flex;flex-wrap:wrap;gap:12px}
.setup-progress__item{font-size:12px;color:#92400e;display:flex;align-items:center;gap:4px}
.setup-progress__item i.done{color:#10b981}
.setup-progress__item i.pending{color:#d1d5db}
/* ss-tabs kept for backward compat but hidden — replaced by ss-sidebar */
.ss-tabs{display:none}
.ss-card{background:#fff;border:1px solid #edf2f7;border-radius:10px;margin-bottom:20px;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.ss-card__header{padding:16px 24px;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;gap:10px}
.ss-card__header i{color:#94a3b8;font-size:14px;width:18px;text-align:center}
.ss-card__header h3{margin:0;font-size:15px;font-weight:700;color:#1e293b}
.ss-card__header p{margin:0;font-size:12px;color:#94a3b8}
.ss-card__body{padding:24px}
.ss-field{margin-bottom:18px}
.ss-field:last-child{margin-bottom:0}
.ss-label{display:block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:#64748b;margin-bottom:6px}
.ss-label .required{color:#ef4444;margin-left:2px}
.ss-hint{font-size:11px;color:#94a3b8;margin-top:4px;line-height:1.4}
.ss-input{width:100%;padding:9px 14px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;color:#334155;transition:border-color .2s,box-shadow .2s;outline:none;font-family:inherit;background:#fff}
.ss-input:focus{border-color:var(--primary,#3b82f6);box-shadow:0 0 0 3px rgba(59,130,246,.08)}
.ss-input[type="color"]{height:42px;padding:4px 8px;cursor:pointer}
select.ss-input{cursor:pointer;appearance:auto}
textarea.ss-input{resize:vertical;min-height:60px}
.ss-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:767px){.ss-row{grid-template-columns:1fr}}
.ss-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
@media(max-width:767px){.ss-row-3{grid-template-columns:1fr}}
.ss-divider{border:none;border-top:1px solid #f1f5f9;margin:24px 0}
.ss-form-section{padding:24px}
.ss-form-section__left{margin-bottom:20px}
.ss-form-section__left h4{font-size:15px;font-weight:700;color:#1e293b;margin:0 0 4px;display:flex;align-items:center;gap:8px}
.ss-form-section__left p{font-size:12px;color:#94a3b8;margin:0;line-height:1.5}
.ss-switch{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#f8fafc;border-radius:8px;border:1px solid #edf2f7;margin-bottom:10px}
.ss-switch:last-child{margin-bottom:0}
.ss-switch label{margin:0;font-size:13px;color:#334155;font-weight:500;cursor:pointer}
.ss-save{padding:20px 24px;border-top:1px solid #f1f5f9;display:flex;justify-content:flex-end;background:#fafbfc;border-radius:0 0 10px 10px}
.ss-save .btn{border-radius:8px;font-weight:600;font-size:13px;padding:10px 24px}
.ss-table{width:100%;border-collapse:separate;border-spacing:0}
.ss-table thead th{background:#f8fafc;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:#94a3b8;padding:12px 16px;border-bottom:2px solid #e2e8f0;white-space:nowrap}
.ss-table tbody td{padding:12px 16px;border-bottom:1px solid #f1f5f9;font-size:13px;color:#334155;vertical-align:middle}
.ss-table tbody tr:hover td{background:#f8fafc}
.ss-table tbody tr:last-child td{border-bottom:none}
.ss-empty{text-align:center;padding:48px 20px}
.ss-empty i{font-size:40px;color:#e2e8f0;margin-bottom:12px;display:block}
.ss-empty p{font-size:13px;color:#94a3b8;margin-bottom:16px}
/* Theme picker */
.theme-picker{display:flex;gap:12px;margin-bottom:8px;flex-wrap:wrap}
.theme-card{background:#fff;border:2px solid #edf2f7;border-radius:8px;overflow:hidden;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;width:180px}
.theme-card:hover{border-color:#cbd5e1;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.theme-card.selected{border-color:var(--primary,#3b82f6);box-shadow:0 0 0 2px rgba(59,130,246,.12)}
.theme-card__preview{position:relative;height:100px;background:#f8fafc;overflow:hidden}
.theme-card__preview img{width:100%;height:100%;object-fit:cover;object-position:top}
.theme-card__placeholder{display:none;width:100%;height:100%;align-items:center;justify-content:center;flex-direction:column;gap:4px;color:#94a3b8;background:linear-gradient(135deg,#f1f5f9 0%,#e2e8f0 100%)}
.theme-card__placeholder i{font-size:20px}
.theme-card__placeholder span{font-size:10px;font-weight:600}
.theme-card__info{padding:8px 10px 4px;flex:1}
.theme-card__name{font-size:12px;font-weight:700;color:#1e293b;margin-bottom:2px}
.theme-card__desc{font-size:10px;color:#94a3b8;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.theme-card__badge{padding:4px 10px 8px;display:flex;align-items:center;justify-content:center}
.theme-card__select-label{font-size:10px;font-weight:600;color:#64748b;padding:2px 10px;border:1px solid #e2e8f0;border-radius:4px;transition:all .2s}
.theme-card:hover .theme-card__select-label{border-color:var(--primary,#3b82f6);color:var(--primary,#3b82f6)}

.ss-action-bar{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-bottom:1px solid #f1f5f9}
.ss-action-bar h3{margin:0;font-size:15px;font-weight:700;color:#1e293b}
.ss-action-bar .btn{border-radius:6px;font-weight:600;font-size:12px}
.ss-back{font-size:12px;color:#64748b;font-weight:500;text-decoration:none;display:inline-flex;align-items:center;gap:4px;margin-bottom:12px}
.ss-back:hover{color:var(--primary,#3b82f6);text-decoration:none}

/* ============================================================
   STORE ORDERS PAGE
   ============================================================ */
#statusTabs .nav-link.active{position:relative}
#statusTabs .nav-link.active::after{content:'';position:absolute;bottom:-2px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #fff}
#store_orders_table{border-collapse:separate;border-spacing:0}
#store_orders_table thead th{background:#f8fafc;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:#94a3b8;padding:14px 16px;border-bottom:2px solid #e2e8f0;white-space:nowrap}
#store_orders_table tbody td{padding:12px 16px;border-bottom:1px solid #f1f5f9;font-size:13px;color:#334155;vertical-align:middle}
#store_orders_table tbody tr:hover td{background:#f8fafc}
#store_orders_table tbody tr:last-child td{border-bottom:none}
.order-num{font-weight:700;color:#1e293b;font-size:13px;cursor:pointer;text-decoration:none}
.order-num:hover{color:var(--primary);text-decoration:underline}
.order-date{font-size:12px;color:#94a3b8}
.order-customer{font-weight:600;color:#1e293b;font-size:13px}
.order-customer small{color:#94a3b8;font-weight:400}
.order-total{font-weight:700;color:#0f172a;font-size:14px}
.order-total small{font-weight:400;color:#94a3b8;font-size:11px}
.order-actions{display:flex;gap:4px;flex-wrap:nowrap}
.order-actions .btn{border-radius:6px;padding:5px 10px;font-size:12px}
.so-modal-header{padding:20px 24px 0;display:flex;justify-content:space-between;align-items:flex-start}
.so-modal-header h3{font-size:16px;font-weight:700;color:#0f172a;margin:0}
.so-modal-header .so-order-num{font-size:12px;color:#64748b;margin-top:2px}
.so-modal-close{background:none;border:none;font-size:20px;color:#94a3b8;cursor:pointer;padding:4px;line-height:1}
.so-modal-close:hover{color:#334155}
.so-modal-body{padding:20px 24px}
.so-modal-body .field{margin-bottom:16px}
.so-modal-body .field:last-child{margin-bottom:0}
.so-modal-body .field label{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#94a3b8;margin-bottom:6px}
.so-modal-body .field input,.so-modal-body .field select,.so-modal-body .field textarea{width:100%;padding:9px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;color:#334155;transition:border-color .2s;outline:none;font-family:inherit}
.so-modal-body .field input:focus,.so-modal-body .field select:focus,.so-modal-body .field textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(62,111,219,.08)}
.so-modal-body .field textarea{resize:vertical;min-height:60px}
.so-modal-footer{padding:0 24px 20px;display:flex;gap:8px;justify-content:flex-end}
.so-modal-footer .btn{border-radius:8px;font-weight:600;font-size:13px;padding:9px 20px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tracking-field{display:none}
.tracking-field.show{display:block}

/* ============================================================
   STORE ORDER VIEW PAGE
   ============================================================ */
.ov-top{background:linear-gradient(135deg,#f8fafc 0%,#f1f5f9 100%);border-bottom:1px solid #e2e8f0;padding:20px 0}
.ov-top-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.ov-back{font-size:12px;color:#64748b;font-weight:500;text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.ov-back:hover{color:var(--primary)}
.ov-title{font-size:22px;font-weight:700;color:#0f172a;margin:4px 0 0}
.ov-meta{display:flex;align-items:center;gap:12px;margin-top:4px;font-size:12px;color:#94a3b8}
.ov-meta i{font-size:11px}
.ov-quick-actions{display:flex;gap:8px;align-items:center}
.ov-quick-actions .btn{border-radius:8px;font-weight:600;font-size:12px;padding:8px 16px}
.items-table{width:100%;border-collapse:separate;border-spacing:0}
.items-table thead th{background:#f8fafc;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:#94a3b8;padding:12px 16px;border-bottom:2px solid #e2e8f0}
.items-table tbody td{padding:14px 16px;border-bottom:1px solid #f1f5f9;vertical-align:middle}
.items-table tbody tr:last-child td{border-bottom:none}
.items-table tbody tr:hover td{background:#fafbfc}
.item-product{display:flex;align-items:center;gap:12px}
.item-img{width:48px;height:48px;object-fit:cover;border-radius:8px;border:1px solid #edf2f7;flex-shrink:0}
.item-img-placeholder{width:48px;height:48px;border-radius:8px;background:#f1f5f9;display:flex;align-items:center;justify-content:center;color:#cbd5e1;flex-shrink:0}
.item-name{font-size:13px;font-weight:500;color:#1e293b;max-width:250px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.totals-wrap{max-width:300px;margin-inline-start:auto;padding:16px 20px}
.total-row{display:flex;justify-content:space-between;padding:6px 0;font-size:13px;color:#64748b}
.total-row span:last-child{color:#334155;font-weight:500}
.total-final{display:flex;justify-content:space-between;padding:12px 0 0;margin-top:8px;border-top:2px solid #e2e8f0;font-size:18px;font-weight:700;color:#0f172a}
.side-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;margin-bottom:16px;overflow:hidden}
.side-card-header{padding:14px 18px;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#334155}
.side-card-header i{color:#94a3b8;font-size:13px;width:16px;text-align:center}
.side-card-body{padding:16px 18px}
.side-row{display:flex;justify-content:space-between;align-items:center;padding:7px 0;font-size:13px}
.side-row:not(:last-child){border-bottom:1px solid #f8fafc}
.side-label{color:#94a3b8;font-weight:500}
.side-value{color:#1e293b;font-weight:600;text-align:end;max-width:60%}
.cust-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:768px){.cust-grid{grid-template-columns:1fr}}
.cust-section-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:#94a3b8;margin-bottom:8px}
.cust-line{font-size:13px;color:#334155;padding:4px 0}
.cust-line strong{font-weight:600;color:#1e293b}
.upd-label{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#94a3b8;margin-bottom:6px}
.upd-input{width:100%;padding:8px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;color:#334155;transition:border-color .2s;outline:none;font-family:inherit}
.upd-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(62,111,219,.08)}

/* ============================================================
   PRODUCTS PAGE (prod-*)
   ============================================================ */
.prod-header{padding:20px 0 16px}
.prod-title{font-size:22px;font-weight:700;color:#1a202c;margin:0 0 6px}
.prod-sub{font-size:13px;color:#718096;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.prod-card{background:#fff;border:1px solid #edf2f7;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.04);overflow:hidden}
.prod-toolbar{padding:14px 20px;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
.prod-toolbar .count{font-size:13px;color:#64748b;font-weight:500}
.prod-table{width:100%;border-collapse:separate;border-spacing:0}
.prod-table thead th{background:#f8fafc;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:#94a3b8;padding:12px 16px;border-bottom:2px solid #e2e8f0;white-space:nowrap}
.prod-table tbody td{padding:14px 16px;border-bottom:1px solid #f1f5f9;font-size:13px;color:#334155;vertical-align:middle}
.prod-table tbody tr:hover td{background:#f8fafc}
.prod-table tbody tr:last-child td{border-bottom:none}
.prod-item{display:flex;align-items:center;gap:12px}
.prod-img{width:56px;height:56px;object-fit:cover;border-radius:8px;border:1px solid #edf2f7;flex-shrink:0}
.prod-name{font-size:13px;font-weight:600;color:#1e293b;max-width:300px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer;text-decoration:none}
.prod-name:hover{color:var(--primary,#3b82f6);text-decoration:underline}
.prod-date{font-size:12px;color:#94a3b8}
.prod-actions{display:flex;gap:4px}
.prod-actions .btn{border-radius:6px;padding:5px 10px;font-size:12px}
.prod-table input[type="checkbox"]{width:18px;height:18px;border-radius:4px;border:2px solid #cbd5e1;cursor:pointer;accent-color:var(--primary,#3b82f6);background:#fff}
.prod-table input[type="checkbox"]:checked{border-color:var(--primary,#3b82f6)}
.bulk-action-bar{display:flex;align-items:center;gap:10px}
.bulk-action-bar .btn{border-radius:6px;font-weight:600;font-size:12px;padding:7px 16px}
.price-option{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#f8fafc;border:1px solid #edf2f7;border-radius:8px;margin-bottom:6px;cursor:pointer;transition:all .2s}
.price-option:hover{border-color:#cbd5e1}
.price-option.selected{border-color:var(--primary,#3b82f6);background:#f0f4ff}
.price-option input[type="radio"]{accent-color:var(--primary,#3b82f6);width:16px;height:16px;flex-shrink:0}
.price-option label{margin:0;font-size:13px;color:#334155;font-weight:500;cursor:pointer}
.slide-carousel{border-radius:10px;overflow:hidden;border:1px solid #edf2f7;margin-bottom:16px}
.slide-carousel .carousel-item img{width:100%;height:280px;object-fit:contain;background:#f8fafc}
.slide-carousel .carousel-control-prev,.slide-carousel .carousel-control-next{width:36px;height:36px;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.4);border-radius:50%;opacity:1}
.slide-stats{display:flex;gap:12px;margin-bottom:16px}
.slide-stat{flex:1;padding:12px;background:#f8fafc;border:1px solid #edf2f7;border-radius:8px;text-align:center}
.slide-stat__val{font-size:18px;font-weight:700;color:#1e293b}
.slide-stat__label{font-size:11px;color:#94a3b8;font-weight:500;margin-top:2px}
.prod-empty{text-align:center;padding:60px 20px}
.prod-empty img{max-width:240px;margin-bottom:20px;opacity:.7}
.prod-empty h3{font-size:16px;font-weight:600;color:#64748b;margin-bottom:4px}
.prod-empty p{font-size:13px;color:#94a3b8}

/* ============================================================
   IMPORT LIST PAGE (il-*)
   ============================================================ */
.il-header{padding:20px 0 16px}
.il-title{font-size:22px;font-weight:700;color:#1a202c;margin:0 0 6px}
.il-sub{font-size:13px;color:#718096;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.il-toolbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.il-toolbar .btn{border-radius:8px;font-weight:600;font-size:13px}
.il-product-card{background:#fff;border:1px solid #edf2f7;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.04);margin-bottom:20px;overflow:hidden}
.il-product-card>.nav-tabs{border-bottom:2px solid #edf2f7;padding:0 16px;background:#f8fafc;margin:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.il-product-card>.nav-tabs::-webkit-scrollbar{display:none}
.il-product-card>.nav-tabs .nav-item{margin-bottom:-2px}
.il-product-card>.nav-tabs .nav-link{border:none;border-bottom:2px solid transparent;padding:12px 16px;font-size:12px;font-weight:600;color:#64748b;white-space:nowrap;transition:all .2s}
.il-product-card>.nav-tabs .nav-link:hover{color:#334155;background:transparent}
.il-product-card>.nav-tabs .nav-link.active{color:var(--primary,#3b82f6);border-bottom-color:var(--primary,#3b82f6);background:transparent}
.il-product-card .tab-content{padding:20px}
.il-product-card .il-tab-actions{margin-left:auto;display:flex;align-items:center;gap:6px;padding:8px 0;flex-wrap:wrap}
.il-product-card .il-tab-actions .btn{border-radius:6px;font-size:11px;font-weight:600;padding:6px 14px}
.il-product-card .col-md-3 img,.il-product-card .col-lg-3 img{border-radius:8px;border:1px solid #edf2f7;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.il-product-card .form-control{border-radius:8px;border-color:#e2e8f0;font-size:13px;padding:9px 14px;transition:border-color .2s,box-shadow .2s}
.il-product-card .form-control:focus{border-color:var(--primary,#3b82f6);box-shadow:0 0 0 3px rgba(59,130,246,.08)}
.il-product-card label{font-size:12px;font-weight:600;color:#64748b}
.il-product-card .table-bordered{border-collapse:separate;border-spacing:0;border:1px solid #edf2f7;border-radius:8px;overflow:hidden}
.il-product-card .table-bordered thead th{background:#f8fafc;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#94a3b8;padding:10px 12px;border-bottom:2px solid #e2e8f0;border-color:#edf2f7}
.il-product-card .table-bordered tbody td{padding:10px 12px;border-color:#f1f5f9;font-size:13px;color:#334155;vertical-align:middle}
.il-product-card .table-bordered tbody tr:hover td{background:#f8fafc}
.il-product-card .img-thumbnail{border-radius:6px;border-color:#edf2f7;box-shadow:0 1px 4px rgba(0,0,0,.06)!important}
.il-product-card .input-images{display:flex;flex-wrap:wrap;gap:10px;padding:12px 0}
.il-product-card .fixed-header tbody{display:block;max-height:350px;overflow-y:auto}
.il-product-card .fixed-header thead,.il-product-card .fixed-header tbody tr{display:table;width:100%;table-layout:fixed}
.il-product-card .fixed-header ::-webkit-scrollbar{width:3px}
.il-product-card .fixed-header ::-webkit-scrollbar-track{background:#f1f5f9}
.il-product-card .fixed-header ::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}
.il-product-card input[type="checkbox"]{accent-color:var(--primary,#3b82f6)}
.loading-dots{display:flex;align-items:center;justify-content:center;font-size:18px;color:#333;margin-top:20px}
.loading-text{margin-right:10px}
.dot{animation:dotAnimation 1s infinite;opacity:0;display:inline-block;margin-right:3px}
@keyframes dotAnimation{0%,20%{opacity:0}50%{opacity:1}100%{opacity:0}}
span.badge{white-space:normal!important}
.blinking-faint-red{color:#ef4444;font-size:12px;font-weight:600}
.il-vat-warning{display:flex;align-items:center;gap:8px;padding:8px 16px;background:#fef2f2;border-top:1px solid #fca5a5;color:#991b1b;font-size:12px;font-weight:600}
.il-vat-warning i{color:#ef4444;font-size:11px;flex-shrink:0}
.modal .table-bordered{border-radius:8px;overflow:hidden}
.modal .table-bordered th{background:#f8fafc;font-size:12px;font-weight:600;color:#64748b}
/* Product Info layout (flexbox instead of float) */
.il-product-info{display:flex;gap:20px;align-items:flex-start}
.il-product-img-wrap{flex-shrink:0}
.il-product-img{width:160px;height:160px;object-fit:cover;border-radius:10px;border:1px solid #edf2f7;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.il-product-fields{flex:1;min-width:0}
.il-original-title{font-size:13px;font-weight:600;color:#94a3b8;margin-bottom:12px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Pricing hint */
.il-pricing-hint{font-size:13px;font-weight:600;color:var(--primary,#3b82f6);margin-bottom:14px;padding:8px 14px;background:rgba(59,130,246,.04);border-radius:6px;border-left:3px solid var(--primary,#3b82f6)}
/* Shipping bar */
.il-shipping-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 16px;background:#f8fafc;border-radius:8px;border:1px solid #edf2f7;margin-top:8px;font-size:13px;color:#334155}
.il-shipping-bar .btn{margin-inline-start:auto}
/* Pricing settings */
.il-pricing-settings h6{font-size:14px;font-weight:700;color:#334155;margin-bottom:12px}
.il-radio-group{display:flex;gap:20px;flex-wrap:wrap}
.il-radio{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:#334155;cursor:pointer;padding:8px 16px;background:#f8fafc;border:1px solid #edf2f7;border-radius:8px;transition:all .2s}
.il-radio:hover{border-color:var(--primary,#3b82f6)}
.il-radio input[type="radio"]{accent-color:var(--primary,#3b82f6)}
/* Description note */
.il-desc-note{font-size:12px;color:#ef4444;font-weight:600;margin-bottom:10px}
/* Empty state */
.il-empty{text-align:center;padding:60px 20px}
.il-empty img{max-width:240px;margin-bottom:20px;opacity:.7}
.il-empty h3{font-size:16px;font-weight:600;color:#64748b;margin-bottom:4px}
.il-empty p{font-size:13px;color:#94a3b8}
/* Responsive: product info stacks on mobile */
@media(max-width:767px){
  .il-product-info{flex-direction:column;align-items:center;text-align:center}
  .il-product-img{width:120px;height:120px}
  .il-product-fields{width:100%}
  .il-radio-group{flex-direction:column;gap:8px}
  .il-shipping-bar{flex-direction:column;align-items:flex-start}
  .il-shipping-bar .btn{margin-inline-start:0;width:100%}
}

/* ============================================================
   SETTINGS PAGE (set-*)
   ============================================================ */
.set-header{padding:20px 0 16px}
.set-title{font-size:22px;font-weight:700;color:#1a202c;margin:0 0 6px}
.set-sub{font-size:13px;color:#718096;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.set-tabs{display:flex;gap:4px;overflow-x:auto;border-bottom:2px solid #edf2f7;padding-bottom:0;margin-bottom:20px;scrollbar-width:none}
.set-tabs::-webkit-scrollbar{display:none}
.set-tabs .nav-item{margin-bottom:-2px}
.set-tabs .nav-link{display:flex;align-items:center;gap:6px;padding:10px 16px;font-size:13px;font-weight:600;color:#64748b;border:none;border-bottom:2px solid transparent;white-space:nowrap;transition:all .2s;background:none}
.set-tabs .nav-link:hover{color:#334155}
.set-tabs .nav-link.active{color:var(--primary,#3b82f6);border-bottom-color:var(--primary,#3b82f6)}
.set-card{background:#fff;border:1px solid #edf2f7;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.04);padding:24px;margin-bottom:20px}
.set-card h3{font-size:15px;font-weight:700;color:#1e293b;margin:0 0 16px}
.set-card .form-control{border-radius:8px;border-color:#e2e8f0;font-size:13px;padding:9px 14px;transition:border-color .2s,box-shadow .2s}
.set-card .form-control:focus{border-color:var(--primary,#3b82f6);box-shadow:0 0 0 3px rgba(59,130,246,.08)}
.set-card label{font-size:13px;color:#334155;cursor:pointer}
.set-card strong{font-size:14px;color:#1e293b}
.set-option{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:6px;margin-bottom:4px;transition:background .2s}
.set-option:hover{background:#f8fafc}
.set-option input[type="radio"],.set-option input[type="checkbox"]{accent-color:var(--primary,#3b82f6);width:16px;height:16px;flex-shrink:0}
.set-card .table-bordered{border-collapse:separate;border-spacing:0;border:1px solid #edf2f7;border-radius:8px;overflow:hidden}
.set-card .table-bordered th{background:#f8fafc;font-size:12px;font-weight:600;color:#64748b;padding:10px 12px;border-color:#edf2f7}
.set-card .table-bordered td{padding:10px 12px;border-color:#f1f5f9;font-size:13px;vertical-align:middle}
.setting-button{width:130px!important}

/* ============================================================
   STORES MANAGEMENT PAGE
   ============================================================ */
.stores-header{padding:20px 0 16px}
.stores-title{font-size:22px;font-weight:700;color:#1a202c;margin:0 0 6px}
.stores-sub{font-size:13px;color:#718096;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.stores-usage{display:flex;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.usage-chip{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#fff;border:1px solid #edf2f7;border-radius:8px;font-size:13px;color:#334155}
.usage-chip i{color:#94a3b8;font-size:14px}
.usage-chip strong{color:#1e293b}
.usage-chip .count{font-weight:700;color:var(--primary,#3b82f6)}
.usage-chip .limit{color:#94a3b8}
.usage-chip.at-limit{border-color:#fbbf24;background:#fffbeb}
.usage-chip.at-limit .count{color:#d97706}
.store-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px}
@media(max-width:575px){.store-grid{grid-template-columns:1fr}}
.store-card{background:#fff;border:1px solid #edf2f7;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.04);overflow:hidden;display:flex;flex-direction:column;transition:border-color .2s}
.store-card:hover{border-color:#cbd5e1}
.store-card.active{border-color:var(--primary,#3b82f6);border-width:2px}
.store-card__header{padding:16px 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #f1f5f9}
.store-card__header .platform-badge{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;padding:3px 8px;border-radius:4px}
.store-card__header .platform-badge--native{background:#dbeafe;color:#1d4ed8}
.store-card__header .platform-badge--salla{background:#1e293b;color:#fff}
.store-card__header .active-indicator{font-size:11px;font-weight:600;color:#10b981;display:flex;align-items:center;gap:4px}
.store-card__body{padding:20px;flex:1}
.store-card__info{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.store-card__avatar{width:44px;height:44px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:#fff;flex-shrink:0}
.store-card__avatar img{width:44px;height:44px;border-radius:8px;object-fit:cover}
.store-card__name{font-size:15px;font-weight:700;color:#1e293b;margin:0}
.store-card__url{font-size:12px;color:#94a3b8;margin:0;word-break:break-all}
.store-card__badges{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.store-card__progress{margin-top:8px}
.store-card__progress-label{font-size:11px;color:#94a3b8;font-weight:500;margin-bottom:4px}
.store-card__progress-bar{height:5px;background:#edf2f7;border-radius:3px;overflow:hidden}
.store-card__progress-fill{height:100%;background:var(--primary,#3b82f6);border-radius:3px;transition:width .3s}
.store-card__footer{padding:12px 20px;border-top:1px solid #f1f5f9;display:flex;gap:6px;flex-wrap:wrap;background:#fafbfc}
.store-card__footer .btn{border-radius:6px;font-size:11px;font-weight:600;padding:6px 12px}

/* Store create type selection */
.cs-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:800px;margin:0 auto}
@media(max-width:767px){.cs-grid{grid-template-columns:1fr}}
.cs-option{background:#fff;border:2px solid #edf2f7;border-radius:12px;padding:32px 28px;text-align:center;transition:all .2s;position:relative;display:flex;flex-direction:column}
.cs-option:hover:not(.disabled){border-color:var(--primary,#3b82f6);box-shadow:0 4px 12px rgba(59,130,246,.1)}
.cs-option.disabled{opacity:.5;pointer-events:none}
.cs-option__icon{width:56px;height:56px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;margin:0 auto 16px}
.cs-option__icon--native{background:#dbeafe;color:#1d4ed8}
.cs-option__icon--salla{background:#1e293b;color:#fff}
.cs-option__title{font-size:18px;font-weight:700;color:#1e293b;margin-bottom:6px}
.cs-option__desc{font-size:13px;color:#64748b;margin-bottom:16px;line-height:1.5}
.cs-option__features{list-style:none;padding:0;margin:0 0 20px;text-align:left}
.cs-option__features li{font-size:13px;color:#334155;padding:5px 0;display:flex;align-items:center;gap:8px}
.cs-option__features li i{color:#10b981;font-size:12px;flex-shrink:0}
.cs-option__usage{font-size:11px;color:#94a3b8;margin-bottom:12px;font-weight:500}
.cs-option__usage strong{color:#334155}
.cs-option__btn{margin-top:auto}
.cs-option__btn .btn{border-radius:8px;font-weight:600;font-size:13px;padding:10px 24px;width:100%}
.cs-limit-badge{position:absolute;top:12px;right:12px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:3px 8px;border-radius:4px;background:#fef3c7;color:#d97706}

/* Store create native form */
.cn-card{background:#fff;border:1px solid #edf2f7;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.04);overflow:hidden}
.cn-card__body{padding:32px}
.cn-step{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--primary,#3b82f6);margin-bottom:6px;display:flex;align-items:center;gap:8px}
.cn-step span{width:22px;height:22px;background:var(--primary,#3b82f6);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px}
.cn-divider{border:none;border-top:1px solid #f1f5f9;margin:28px 0}
.cn-card .form-control{border-radius:8px;border-color:#e2e8f0;font-size:13px;padding:10px 14px;transition:border-color .2s,box-shadow .2s}
.cn-card .form-control:focus{border-color:var(--primary,#3b82f6);box-shadow:0 0 0 3px rgba(59,130,246,.08)}
.cn-card .form-control-lg{font-size:14px;padding:12px 16px}
.cn-card label{font-size:12px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.3px}
.cn-card .input-group-text{border-radius:0 8px 8px 0;border-color:#e2e8f0;background:#f8fafc;font-size:13px;color:#64748b}
.cn-save{padding:24px 32px;border-top:1px solid #f1f5f9;background:#fafbfc}
.cn-save .btn{border-radius:8px;font-weight:600;font-size:14px;padding:12px}

/* Store create salla form */
.cs-card{background:#fff;border:1px solid #edf2f7;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.04);overflow:hidden}
.cs-card__body{padding:32px}
.cs-step{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#334155;margin-bottom:6px;display:flex;align-items:center;gap:8px}
.cs-step span{width:22px;height:22px;background:#1e293b;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px}
.cs-divider{border:none;border-top:1px solid #f1f5f9;margin:28px 0}
.cs-card .form-control{border-radius:8px;border-color:#e2e8f0;font-size:13px;padding:10px 14px;transition:border-color .2s,box-shadow .2s}
.cs-card .form-control:focus{border-color:var(--primary,#3b82f6);box-shadow:0 0 0 3px rgba(59,130,246,.08)}
.cs-card .form-control-lg{font-size:14px;padding:12px 16px}
.cs-card label{font-size:12px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.3px}
.cs-how-it-works{background:#f8fafc;border:1px solid #edf2f7;border-radius:8px;padding:16px 20px}
.cs-how-it-works li{font-size:13px;color:#334155;padding:6px 0;display:flex;align-items:center;gap:8px}
.cs-how-it-works li i{color:#10b981;font-size:13px;flex-shrink:0}
.cs-save{padding:24px 32px;border-top:1px solid #f1f5f9;background:#fafbfc}
.cs-save .btn{border-radius:8px;font-weight:600;font-size:14px;padding:12px}

/* Store delete page */
.del-card{background:#fff;border:2px solid #fecaca;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.04);overflow:hidden}
.del-card__header{padding:16px 24px;background:#fef2f2;border-bottom:1px solid #fecaca;display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:#dc2626}
.del-card__body{padding:24px}
.del-store-info{display:flex;align-items:center;gap:12px;padding:16px;background:#f8fafc;border:1px solid #edf2f7;border-radius:8px;margin-bottom:16px}
.del-store-avatar{width:44px;height:44px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:#fff;flex-shrink:0}
.del-store-name{font-size:15px;font-weight:700;color:#1e293b;margin:0}
.del-store-meta{font-size:12px;color:#94a3b8;margin:0}
.del-warning{background:#fffbeb;border:1px solid #fbbf24;border-radius:8px;padding:14px 18px;margin-bottom:20px;font-size:13px;color:#92400e;line-height:1.6}
.del-warning strong{color:#78350f}
.del-card__footer{padding:16px 24px;border-top:1px solid #f1f5f9;background:#fafbfc;display:flex;flex-direction:column;gap:8px}
.del-card__footer .btn{border-radius:8px;font-weight:600;font-size:13px;padding:10px}

/* ============================================================
   ACCOUNT PAGE (acct-*)
   ============================================================ */
.acct-card{background:#fff;border:1px solid #edf2f7;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.04);margin-bottom:20px}
.acct-section{display:grid;grid-template-columns:260px 1fr;gap:32px;padding:24px}
@media(max-width:991px){.acct-section{grid-template-columns:1fr;gap:12px}}
.acct-section__left h3{font-size:14px;font-weight:700;color:#1e293b;margin:0 0 4px}
.acct-section__left p{font-size:12px;color:#94a3b8;margin:0;line-height:1.5}
.acct-divider{border:none;border-top:1px solid #f1f5f9;margin:0}
.acct-card .form-control{border-radius:8px;border-color:#e2e8f0;font-size:13px;padding:9px 14px;transition:border-color .2s,box-shadow .2s}
.acct-card .form-control:focus{border-color:var(--primary,#3b82f6);box-shadow:0 0 0 3px rgba(59,130,246,.08)}
.acct-card label{font-size:12px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.3px}
.acct-save{padding:20px 24px;border-top:1px solid #f1f5f9;display:flex;justify-content:flex-end;background:#fafbfc;border-radius:0 0 10px 10px}
.acct-save .btn{border-radius:8px;font-weight:600;font-size:13px;padding:10px 24px}

/* ============================================================
   AFFILIATE DASHBOARD
   ============================================================ */
#iban_certificate_preview{width:200px;height:200px;border:2px solid #e2e8f0;border-radius:8px;display:none;position:relative}
#iban_certificate_preview img{max-width:100%;max-height:100%;border-radius:6px}
.delete-icon,.view-icon{position:absolute;top:-2px;cursor:pointer;display:none}
.delete-icon{right:-29px}
.view-icon{right:-29px;top:27px}
.btn-xs{padding:4px 8px;font-size:12px;line-height:1.5;border-radius:4px}
.hidden{display:none}
@media(max-width:767px){.stat-grid{grid-template-columns:1fr!important}}