:root,:root[data-theme=light]{--app-bg: #f4f7fb;--content-bg: #ffffff;--panel-bg: #ffffff;--header-bg: #1e88e5;--header-text: #ffffff;--sidebar-bg: #f8fafc;--sidebar-hover-bg: #e3f2fd;--border-color: #d8e1ec;--text-color: #1f2a37;--text-muted: #5f6f82;--link-color: #1f2a37}:root[data-theme=dark]{--app-bg: #07101e;--content-bg: #0b1220;--panel-bg: #111a2b;--header-bg: #0a1424;--header-text: #edf5ff;--sidebar-bg: #08111f;--sidebar-hover-bg: #14243a;--border-color: #27364e;--text-color: #e4edf8;--text-muted: #a8b6cc;--link-color: #e4edf8;--surface-raised: #131e31;--surface-soft: #172235;--field-bg: #0d1728;--accent-blue: #55a7ff;--accent-teal: #32d5bd;--accent-green: #62d99b;--accent-orange: #f4a261;--danger: #f87171;--warning: #f6c665}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--app-bg);color:var(--text-color);transition:background-color .2s ease,color .2s ease}.app{display:flex;flex-direction:column;height:100vh;font-family:Arial,sans-serif;background:var(--app-bg);color:var(--text-color)}.header{background-color:var(--header-bg);color:var(--header-text);padding:1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--border-color)}.header-actions{display:flex;align-items:center;gap:.8rem}.welcome{font-size:.9rem;opacity:.95;color:var(--header-text)}.logout-btn{border:1px solid var(--header-text);background:transparent;color:var(--header-text);border-radius:8px;padding:.4rem .72rem;cursor:pointer}.main{display:flex;flex:1;overflow:hidden}.main-login{display:block}.sidebar{width:200px;background-color:var(--sidebar-bg);border-right:1px solid var(--border-color);overflow-y:auto;height:100%}.nav-groups,.nav-sublist{list-style:none}.nav-group{border-bottom:1px solid var(--border-color)}.nav-group:last-child{border-bottom:none}.nav-group-title{width:100%;border:none;background:transparent;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.85rem 1rem;font:inherit;font-weight:700;text-align:left;transition:background-color .16s ease,color .16s ease}.nav-group-title:hover{background-color:var(--sidebar-hover-bg);color:var(--link-color)}.nav-group-title:after{content:"›";color:var(--text-muted);transform:rotate(0);transition:transform .16s ease}.nav-group-open>.nav-group-title:after{transform:rotate(90deg)}.nav-group-active>.nav-group-title{color:#64b5f6;background:#1e88e51f}.nav-group-meta{margin-left:auto;border-radius:999px;background:#94a3b829;color:var(--text-muted);min-width:1.6rem;padding:.08rem .42rem;font-size:.72rem;line-height:1.3;text-align:center}.nav-sublist{padding:.25rem 0 .55rem}.nav-subitem{padding:0 .6rem .22rem 1rem}.nav-subitem a{text-decoration:none;color:var(--link-color)}.nav-link{display:flex;align-items:center;justify-content:space-between;gap:.5rem;border-radius:9px;padding:.5rem .7rem;color:var(--link-color);transition:background-color .16s ease,color .16s ease,transform .16s ease}.nav-link:hover{background-color:var(--sidebar-hover-bg);transform:translate(2px)}.nav-link.router-link-active{font-weight:700;color:#64b5f6;background:#1e88e529;box-shadow:inset 3px 0 #1e88e5}.nav-tag{flex-shrink:0;padding:.1rem .4rem;border-radius:999px;background:#dbeafe;color:#1d4ed8;font-size:.72rem;font-weight:700}.content{flex:1;min-width:0;padding:2rem;overflow-y:auto;background:var(--content-bg)}.content-login{padding:0}.brand-lockup{display:inline-flex;align-items:center;gap:.75rem;min-width:0}.brand-logo{width:42px;height:42px;flex:0 0 42px;border-radius:12px;object-fit:contain;background:#fff;padding:5px;box-shadow:0 8px 22px #0307122e}.brand-copy{display:flex;flex-direction:column;gap:.12rem;min-width:0}.brand-copy h1{margin:0;line-height:1.05;font-size:1.45rem;letter-spacing:0;white-space:nowrap}.brand-copy span{color:#ffffffb8;font-size:.78rem;font-weight:700;letter-spacing:0}.nav-title-main,.nav-link-label{display:inline-flex;align-items:center;gap:.55rem;min-width:0}.nav-link-label>span:last-child,.nav-title-main>span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis}.nav-icon{width:1.05rem;height:1.05rem;flex:0 0 1.05rem;color:currentColor;opacity:.9}.nav-icon svg{display:block;width:100%;height:100%}.nav-group-icon{width:1.1rem;height:1.1rem}.nav-link.router-link-active .nav-icon,.nav-group-active>.nav-group-title .nav-icon{color:var(--accent-blue, #1e88e5);opacity:1}:root[data-theme=dark] body{background:radial-gradient(circle at top left,rgba(85,167,255,.09),transparent 34%),var(--app-bg)}:root[data-theme=dark] .content:not(.content-login){background:linear-gradient(180deg,#0b1220fa,#07101e)}:root[data-theme=dark] .content:not(.content-login) :where(.page-header,.page-head,.section-header,.section-head,.card,.filter-card,.password-reset-card,.manual-bind-referral-card,.validity-card,.member-table-card,.metric-card,.panel,.dashboard-card,.summary-card,.stat-card,.settings-card,.form-card,.table-card,.list-card,.category-group,.category-groups,.related-link-card,.cover-preview-card,.modal-content,.modal-card,.dialog,.drawer,.empty-state,.table-shell,.image-upload-area,.multi-image-area,.sku-section,.filter-grid,.filters,.toolbar,.tabs){background-color:var(--panel-bg)!important;color:var(--text-color)!important;border-color:var(--border-color)!important;box-shadow:0 18px 50px #0000002e!important}:root[data-theme=dark] .content:not(.content-login) :where(.page-header,.page-head){background:linear-gradient(135deg,#12385f,#0f263e 54%,#102b31)!important}:root[data-theme=dark] .content:not(.content-login) :where(h1,h2,h3,h4,h5,h6,label,strong,th,.title,.section-title,.primary-text,.member-name-cell,.category-group-title){color:#edf5ff!important}:root[data-theme=dark] .content:not(.content-login) :where(p,small,.subtitle,.hint,.secondary-text,.muted,.count,.section-count,.category-group-tag,.empty,.empty-hint,.empty-hint-sm,.info-label,.note-text){color:var(--text-muted)!important}:root[data-theme=dark] .content:not(.content-login) :where(table,.table){background:transparent!important;color:var(--text-color)!important;border-color:var(--border-color)!important}:root[data-theme=dark] .content:not(.content-login) :where(thead,th){background:#172235!important;color:#dce8f7!important;border-color:var(--border-color)!important}:root[data-theme=dark] .content:not(.content-login) :where(td){background:transparent!important;color:#d7e3f3!important;border-color:#94a3b82e!important}:root[data-theme=dark] .content:not(.content-login) :where(tbody tr:hover,tbody tr:hover td){background:#55a7ff14!important}:root[data-theme=dark] .content:not(.content-login) :where(input:not([type=checkbox]):not([type=radio]),select,textarea,.form-control){background-color:var(--field-bg)!important;color:#edf5ff!important;border-color:#314158!important;box-shadow:inset 0 0 0 1px #ffffff05!important}:root[data-theme=dark] .content:not(.content-login) :where(input:disabled,select:disabled,textarea:disabled,.form-control:disabled,input[readonly],textarea[readonly]){background-color:#111827!important;color:#8fa1ba!important;border-color:#27364e!important;opacity:1!important}:root[data-theme=dark] .content:not(.content-login) :where(input::placeholder,textarea::placeholder){color:#7f8fa8!important}:root[data-theme=dark] .content:not(.content-login) :where(.btn-secondary,.small-btn.btn-secondary,button.btn-secondary){background:#182438!important;color:#dfeafe!important;border-color:#33465f!important}:root[data-theme=dark] .content:not(.content-login) :where(.btn-primary,button.btn-primary){background:linear-gradient(135deg,#2f8df6,#22b8a7)!important;color:#fff!important;border-color:transparent!important}:root[data-theme=dark] .content:not(.content-login) :where(.btn-danger,button.btn-danger){background:#b93545!important;color:#fff!important;border-color:#d34c5c!important}:root[data-theme=dark] .content:not(.content-login) :where(.badge,.tag,.summary-pill,.category-tag,.member-id-pill,code,.product-code){border-color:#94a3b838!important;color:#dce8f7!important}:root[data-theme=dark] .content:not(.content-login) :where(.modal-overlay,.modal-mask){background:#000000ad!important}:root[data-theme=dark] .content:not(.content-login) :where(.modal-header,.modal-head,.modal-foot,.form-actions){background:transparent!important;border-color:var(--border-color)!important}:root[data-theme=dark] .content:not(.content-login) :where(a){color:#82c6ff}:root[data-theme=dark] .content:not(.content-login) :where(img,.product-thumb,.preview-img){background:#ffffff0a;border-color:#94a3b833!important}:root[data-theme=dark] .content:not(.content-login) :where([style*="background: #fff"],[style*="background:#fff"],[style*="background-color: #fff"],[style*="background-color:#fff"],[style*="background: white"],[style*="background-color: white"]){background:var(--panel-bg)!important}:root[data-theme=dark] .content:not(.content-login) :where([style*="color: #333"],[style*="color:#333"],[style*="color: #1f"],[style*="color:#1f"],[style*="color: black"]){color:var(--text-color)!important}@media(max-width:768px){.main{flex-direction:column}.sidebar{width:100%;height:auto;max-height:46vh;border-right:none;border-bottom:1px solid var(--border-color);position:relative}.sidebar:before,.sidebar:after{content:"";position:absolute;top:0;bottom:0;width:18px;pointer-events:none;z-index:1}.sidebar:before{left:0;background:linear-gradient(to right,var(--sidebar-bg),transparent)}.sidebar:after{right:0;background:linear-gradient(to left,var(--sidebar-bg),transparent)}.sidebar nav{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch}.sidebar nav::-webkit-scrollbar{display:none}.nav-groups{display:flex;gap:.55rem;min-width:max-content;padding:.55rem .7rem}.nav-group{flex:0 0 210px;border:1px solid var(--border-color);border-radius:14px;overflow:hidden;background:#0f172a5c}.nav-group-title{padding:.65rem .75rem}.nav-sublist{max-height:28vh;overflow-y:auto;padding:.18rem .35rem .5rem}.nav-subitem{padding:0 0 .18rem}.nav-link{padding:.42rem .6rem;font-size:14px}.nav-link.router-link-active{color:#fff!important;background:#1e88e5;box-shadow:0 2px 6px #1e88e540}.header{flex-direction:row;align-items:center;padding:.7rem 1rem}.brand-logo{width:36px;height:36px;flex-basis:36px}.brand-copy h1{font-size:1.1rem}.brand-copy span{display:none}}
