@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap";:root{color:#111827;background:#f8fafc;font-family:DM Sans,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}h1{font-size:24px}h2{font-size:21px}h3{font-size:16px}.shell{min-height:100vh;display:flex}.shell aside{z-index:3;background:#fff;border-right:1px solid #e5e7eb;flex-direction:column;width:255px;padding:22px 14px;display:flex;position:fixed;inset:0 auto 0 0}.brand{align-items:center;gap:9px;padding:4px 11px 28px;font-size:20px;font-weight:700;display:flex}.brand span,.login-mark{color:#fff;background:#2563eb;border-radius:10px;place-items:center;width:31px;height:31px;display:grid}.shell nav{gap:4px;display:grid}.shell nav a{color:#6b7280;border-radius:9px;align-items:center;gap:12px;padding:11px 12px;font-size:14px;font-weight:600;display:flex}.shell nav a.active,.shell nav a:hover{color:#2563eb;background:#dbeafe}.sidebar-user{border-top:1px solid #e5e7eb;gap:3px;margin-top:auto;padding:18px 10px 4px;font-size:13px;display:grid}.sidebar-user small,.muted{color:#6b7280}.sidebar-user button{color:#ef4444;background:0 0;border:0;align-items:center;gap:7px;margin-top:11px;padding:0;display:flex}.shell main{width:calc(100% - 255px);margin-left:255px}.topbar{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffd9;border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;height:106px;padding:24px 38px;display:flex}.topbar p,.page-action p,.section-title p{color:#6b7280;margin-bottom:4px;font-size:13px}.avatar{color:#2563eb;background:#dbeafe;border-radius:50%;place-items:center;width:39px;height:39px;font-weight:700;display:grid}.content{max-width:1500px;padding:30px 38px}.card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:20px;box-shadow:0 2px 7px #0f172a08}.stats{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.stat{align-items:center;gap:14px;display:flex}.stat h2{margin-top:3px}.stat p{color:#6b7280;font-size:13px}.stat-icon{border-radius:11px;place-items:center;width:43px;height:43px;display:grid}.blue{color:#2563eb;background:#dbeafe}.purple{color:#7c3aed;background:#ede9fe}.green{color:#10b981;background:#d1fae5}.orange{color:#d97706;background:#fef3c7}.dashboard-grid,.detail-grid{grid-template-columns:1.15fr .85fr;gap:18px;margin-top:18px;display:grid}.dashboard-grid>.card+.card{min-width:0}.section-title,.page-action,.button-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.section-title a{color:#2563eb;align-items:center;font-size:13px;display:flex}.chart{height:245px;margin-top:20px}.order-list{margin-top:10px}.order-row{border-bottom:1px solid #f1f5f9;grid-template-columns:1fr auto auto;align-items:center;gap:18px;padding:13px 0;font-size:13px;display:grid}.order-row span{gap:2px;display:grid}.order-row small{color:#6b7280}.badge{text-transform:capitalize;color:#475569;background:#f1f5f9;border-radius:999px;padding:5px 8px;font-size:11px;font-weight:700}.badge.approved,.badge.processing,.badge.delivered{color:#047857;background:#d1fae5}.badge.pending_payment,.badge.payment_verification,.badge.ready_for_dispatch{color:#b45309;background:#fef3c7}.badge.cancelled,.badge.rejected{color:#b91c1c;background:#fee2e2}.page-action{margin-bottom:22px}.btn{border:0;border-radius:9px;align-items:center;gap:7px;padding:10px 15px;font-size:13px;font-weight:700;display:inline-flex}.btn.primary{color:#fff;background:#2563eb}.btn.secondary{color:#2563eb;background:#dbeafe}.btn.ghost{background:#fff;border:1px solid #e5e7eb}.btn.danger{color:#fff;background:#ef4444}.field{gap:6px;margin-top:14px;font-size:13px;font-weight:600;display:grid}.field input,.field textarea,.field select,.variation-row input,textarea{color:#111827;background:#fff;border:1px solid #dbe1ea;border-radius:8px;outline-color:#2563eb;width:100%;padding:10px 11px;font-size:14px}.table-tools{color:#6b7280;justify-content:space-between;align-items:center;margin-bottom:16px;font-size:13px;display:flex}.search{border:1px solid #e5e7eb;border-radius:8px;align-items:center;gap:8px;padding:8px 10px;display:flex}.search input{border:0;outline:0}.table-wrap{overflow:auto}table{border-collapse:collapse;text-align:left;width:100%;font-size:13px}th{color:#6b7280;text-transform:uppercase;letter-spacing:.04em;font-size:11px}th,td{border-bottom:1px solid #f1f5f9;padding:13px 8px}.product-cell{align-items:center;gap:10px;display:flex}.product-cell img,.image-placeholder{object-fit:cover;background:#f1f5f9;border-radius:7px;width:38px;height:38px}.product-cell span{gap:3px;display:grid}.product-cell small{color:#6b7280}.row-actions{gap:8px;display:flex}.row-actions a,.row-actions button,.icon-btn{color:#475569;background:#f8fafc;border:0;border-radius:7px;padding:7px}.danger{color:#ef4444}.form-grid{grid-template-columns:1.25fr .75fr;gap:18px;display:grid}.two-col{grid-template-columns:1fr 1fr;gap:12px;display:grid}.checks{gap:12px;margin-top:16px;font-size:13px;display:grid}.upload{color:#2563eb;cursor:pointer;border:1px dashed #93c5fd;border-radius:10px;place-items:center;gap:7px;margin-top:14px;padding:25px;display:grid}.upload input{display:none}.image-grid,.proofs{flex-wrap:wrap;gap:9px;margin-top:12px;display:flex}.image-grid img,.proofs img{object-fit:cover;border-radius:8px;width:70px;height:70px}.variations{margin-top:18px}.variation-row{grid-template-columns:1fr 1fr .8fr .8fr 1fr auto;gap:8px;margin-top:12px;display:grid}.filters,.chip-row{gap:7px;margin-bottom:15px;display:flex;overflow:auto}.filters button,.chip{text-transform:capitalize;white-space:nowrap;background:#fff;border:1px solid #e5e7eb;border-radius:999px;padding:7px 10px;font-size:12px}.filters .active,.chip.active{color:#fff;background:#2563eb;border-color:#2563eb}.table{gap:0;display:grid}.table-head,.table-row{border-bottom:1px solid #f1f5f9;grid-template-columns:1.2fr 1.2fr 1fr .8fr;align-items:center;gap:12px;padding:13px 4px;font-size:13px;display:grid}.table-head{color:#6b7280;text-transform:uppercase;letter-spacing:.04em;font-size:11px;font-weight:700}.table-row span{gap:2px;display:grid}.table-row small{color:#6b7280}.detail-grid>div{gap:18px;display:grid}.line-item{border-bottom:1px solid #f1f5f9;align-items:center;gap:11px;padding:11px 0;display:flex}.line-item img{object-fit:cover;border-radius:7px;width:48px;height:48px}.line-item span{flex:1;gap:3px;display:grid}.line-item small{color:#6b7280}.total{justify-content:space-between;padding-top:16px;display:flex}.back{color:#2563eb;background:0 0;border:0;align-items:center;gap:5px;margin-bottom:8px;padding:0;display:flex}.category-list>div{border-bottom:1px solid #f1f5f9;justify-content:space-between;padding:14px 0;display:flex}.category-list span{gap:4px;display:grid}.category-list small{color:#6b7280}.category-list-images .category-row{align-items:center;gap:12px}.category-row-main{flex:1;align-items:center;gap:12px;display:flex}.category-thumb{object-fit:cover;background:#f1f5f9;border:1px solid #e5e7eb;border-radius:10px;flex-shrink:0;width:52px;height:52px}.category-thumb.placeholder{color:#9ca3af;text-align:center;place-items:center;padding:4px;font-size:10px;display:grid}.category-preview{object-fit:cover;border:1px solid #e5e7eb;border-radius:10px;width:88px;height:88px}.upload-compact{margin-top:6px;padding:14px}.square-lg{border-radius:12px;width:72px;height:72px}.hint-box{background:#eff6ff;border:1px solid #dbeafe;border-radius:10px;margin-bottom:12px;padding:10px 12px;font-size:12px}.onboarding-preview{object-fit:cover;border:1px solid #e5e7eb;border-radius:16px;width:160px;height:160px;margin-top:8px}.banner-admin-list{gap:16px;display:grid}.banner-admin-item{border-bottom:1px solid #f1f5f9;grid-template-columns:200px 1fr auto;align-items:center;gap:16px;padding:12px 0;display:grid}.banner-admin-preview{aspect-ratio:2;object-fit:cover;background:#f8fafc;border:1px solid #e5e7eb;border-radius:12px;width:200px}.banner-admin-info{gap:4px;display:grid}.banner-admin-info small{color:#6b7280}.banner-form-preview{aspect-ratio:2;object-fit:cover;border:1px solid #e5e7eb;border-radius:12px;width:100%;max-width:360px;margin-top:8px}@media (width<=700px){.banner-admin-item{grid-template-columns:1fr}.banner-admin-preview{width:100%}}.modal-backdrop{z-index:6;background:#0f172a66;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal{background:#fff;border-radius:14px;width:min(460px,100%);padding:20px;box-shadow:0 20px 50px #11182733}.modal header{justify-content:space-between;align-items:center;display:flex}.modal .button-row{justify-content:flex-end;margin-top:19px}.loading,.empty{color:#6b7280;align-content:center;place-items:center;gap:8px;min-height:230px;display:grid}.loading i{border:3px solid #dbeafe;border-top-color:#2563eb;border-radius:50%;width:24px;height:24px;animation:1s linear infinite spin}.empty h3{color:#111827}.login-page{background:linear-gradient(145deg,#eff6ff,#fff 60%);place-items:center;min-height:100vh;padding:20px;display:grid}.login-card{background:#fff;border:1px solid #e5e7eb;border-radius:18px;gap:12px;width:min(400px,100%);padding:38px;display:grid;box-shadow:0 20px 50px #1e3a8a15}.login-card .login-mark{margin-bottom:7px}.login-card>p{color:#6b7280}.login-card .btn{justify-content:center;margin-top:6px}.login-card small{color:#6b7280;text-align:center;margin-top:5px}.error{color:#dc2626}.success{color:#047857;margin:-10px 0 18px}.menu-btn,.mobile-close{display:none}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=900px){.shell aside{transition:all .2s;transform:translate(-100%)}.shell aside.open{transform:none;box-shadow:15px 0 40px #11182720}.shell main{width:100%;margin:0}.menu-btn,.mobile-close{background:0 0;border:0;display:block}.mobile-close{margin-left:auto}.topbar{height:86px;padding:18px 20px}.topbar>div:first-of-type{margin-right:auto}.content{padding:22px 20px}.stats{grid-template-columns:repeat(2,1fr)}.dashboard-grid,.form-grid,.detail-grid{grid-template-columns:1fr}.menu-btn{margin-right:13px}}@media (width<=560px){.stats{grid-template-columns:1fr}.page-action{align-items:flex-start}.page-action .button-row{flex-wrap:wrap;justify-content:flex-end}.two-col{grid-template-columns:1fr}.variation-row{grid-template-columns:1fr 1fr}.variation-row .icon-btn{grid-column:span 2}.topbar h1{font-size:18px}.topbar p{display:none}.order-row{grid-template-columns:1fr auto}.order-row>b{display:none}}