:root{--bg:#0b1020;--panel:#111832;--card:#151d3a;--line:#273150;--txt:#f5f7ff;--muted:#98a3c7;--pri:#7c3aed;--pri2:#06b6d4;--ok:#22c55e;--bad:#ef4444;--warn:#f59e0b}*{box-sizing:border-box}body{
    margin:0;
    color:#fff;
    background:
    radial-gradient(circle at top,#7c3aed55,transparent 25%),
    radial-gradient(circle at bottom,#06b6d455,transparent 25%),
    var(--bg);
}
a{text-decoration:none;color:inherit}.wrap{max-width:1180px;margin:auto;padding:20px}.topbar{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.08)}.nav{display:flex;gap:12px;align-items:center}.logo{font-weight:900;font-size:22px;padding:13px 18px;border-radius:18px;background:linear-gradient(135deg,var(--pri),var(--pri2));box-shadow:0 16px 35px rgba(124,58,237,.35)}.search{flex:1;display:flex;gap:10px}.input,textarea,select{width:100%;border:1px solid var(--line);background:#0d1429;color:var(--txt);border-radius:14px;padding:13px 15px;outline:none}.btn{border:0;border-radius:14px;padding:12px 18px;background:#1c2547;color:#fff;font-weight:800;cursor:pointer;display:inline-block}.btn.primary{background:linear-gradient(135deg,var(--pri),var(--pri2));box-shadow:0 14px 30px rgba(124,58,237,.28)}.btn.danger{background:var(--bad)}.btn.ok{background:var(--ok);color:#04110a}.hero{padding:40px 0;display:grid;grid-template-columns:1.5fr .8fr;gap:22px}.heroBox,.card,.panel{background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));border:1px solid rgba(255,255,255,.1);border-radius:26px;box-shadow:0 20px 60px rgba(0,0,0,.25)}.heroBox{padding:34px}.hero h1{font-size:44px;margin:0 0 12px}.muted{color:var(--muted)}.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;padding:20px}.stat{padding:18px;border-radius:20px;background:rgba(255,255,255,.06)}.stat b{display:block;font-size:24px}.layout{display:grid;grid-template-columns:260px 1fr;gap:22px}.sidebar{position:sticky;top:90px;height:max-content}.cat{display:block;padding:14px 16px;border-radius:15px;margin:8px 0;color:#dce3ff;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07)}.cat.active,.cat:hover{background:linear-gradient(135deg,rgba(124,58,237,.9),rgba(6,182,212,.65))}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.product{padding:16px;position:relative;overflow:hidden}.product img{width:100%;height:180px;object-fit:cover;border-radius:14px;background:#111827}.product h3{margin:14px 0 8px}.price{font-size:22px;font-weight:900;color:#ff6b9a}.stock{display:inline-block;padding:7px 10px;border-radius:999px;background:rgba(34,197,94,.14);color:#86efac;font-weight:800;font-size:13px}.actions{display:flex;gap:10px;margin-top:13px}.table{width:100%;border-collapse:separate;border-spacing:0 10px}.table th{text-align:left;color:var(--muted);font-size:13px}.table td{background:rgba(255,255,255,.06);padding:14px;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}.table td:first-child{border-radius:14px 0 0 14px;border-left:1px solid rgba(255,255,255,.08)}.table td:last-child{border-radius:0 14px 14px 0;border-right:1px solid rgba(255,255,255,.08)}.form{max-width:520px;margin:50px auto;padding:24px}.alert{padding:13px 15px;border-radius:15px;margin:12px 0;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.35)}.alert.err{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.35)}.adminNav{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}.adminNav a{padding:12px 15px;border-radius:14px;background:#111832;border:1px solid var(--line);font-weight:800}.adminGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.adminCard{padding:20px}.small{font-size:12px}.itemBox{font-family:ui-monospace,Consolas,monospace;white-space:pre-wrap;word-break:break-word;background:#081021;border-radius:15px;padding:14px;border:1px solid var(--line)}@media(max-width:800px){.hero,.layout{grid-template-columns:1fr}.nav{flex-wrap:wrap}.search{order:3;width:100%;flex-basis:100%}.hero h1{font-size:32px}}
.admin-menu{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-bottom:25px;
}

.admin-menu a{
    background:linear-gradient(135deg,var(--pri),var(--pri2));
    color:#fff;
    padding:10px 16px;
    border-radius:12px;
    text-decoration:none;
    font-weight:600;
    transition:0.2s;
    box-shadow:0 4px 12px rgba(108,71,255,0.2);
}

.admin-menu a:hover{
    filter:brightness(.88);
    transform:translateY(-2px);
}.btn-copy{
    background:linear-gradient(135deg,#00c853,#00e676);
    color:#fff;
    border:none;
    font-weight:700;
    box-shadow:0 0 15px rgba(0,255,120,0.25);
}

.btn-copy:hover{
    transform:translateY(-2px);
    background:linear-gradient(135deg,#00e676,#00ff95);
    box-shadow:0 0 20px rgba(0,255,120,0.4);
}
.cat .fa-instagram{
    background:linear-gradient(45deg,#f58529,#dd2a7b,#8134af,#515bd4);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.cat .fa-facebook{
    color:#1877f2;
}
/* ===== System settings upgrade ===== */
.pref-controls{display:flex;gap:6px}.pref-controls select{width:auto;min-width:68px;padding:10px 8px;border-radius:12px}
.settings-two{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:10px}.color-input{height:48px;padding:5px}
.account-stats{margin-bottom:18px}.account-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0}.account-section{padding:20px}.account-section .input{margin:7px 0 12px}.account-section .btn{margin-top:4px}
.grid.product-view-grid{grid-template-columns:repeat(auto-fill,minmax(var(--product-min,280px),1fr))}
.grid.product-view-list{grid-template-columns:1fr}.product-view-list .product{display:grid;grid-template-columns:150px 1fr auto;gap:14px;align-items:center}.product-view-list .product img{width:150px;height:100px;margin:0}.product-view-list .product h3,.product-view-list .product p,.product-view-list .product .actions{margin:0}.product-view-list .product .actions{justify-content:flex-end}
hr{border:0;border-top:1px solid var(--line);margin:24px 0}
@media(max-width:800px){.settings-two,.account-settings-grid{grid-template-columns:1fr}.pref-controls{order:2}.product-view-list .product{grid-template-columns:1fr}.product-view-list .product img{width:100%;height:170px}}

/* ===== Account access + customer summary ===== */
.account-nav-btn{display:flex;align-items:center;gap:8px;white-space:nowrap}
.account-nav-meta{font-size:12px;color:#cbd5e1;font-weight:700}
.layout.with-account{grid-template-columns:230px minmax(0,1fr) 235px}
.account-sidebar{position:sticky;top:90px;height:max-content;padding:16px;border-radius:22px}
.account-side-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
.account-side-head h3{margin:3px 0 0;font-size:16px}
.small-account-btn{padding:8px 10px;font-size:12px}
.account-side-stat{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.account-side-stat span{color:var(--muted);font-size:13px}.account-side-stat b{font-size:16px}
.account-side-stat.discount b{color:#86efac;font-size:20px}
.discount-note{margin-top:12px;padding:11px 12px;border-radius:13px;background:rgba(34,197,94,.10);border:1px solid rgba(34,197,94,.25);color:#b7f7ca;font-size:12px;line-height:1.45}
.product-price-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.old-price{text-decoration:line-through;color:var(--muted);font-size:14px}
.discount-badge{display:inline-block;padding:5px 8px;border-radius:999px;background:rgba(34,197,94,.15);color:#86efac;font-weight:900;font-size:12px}
@media(max-width:1050px){.layout.with-account{grid-template-columns:220px minmax(0,1fr)}.account-sidebar{grid-column:1/-1;position:static;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.account-side-head,.discount-note{grid-column:1/-1}.account-side-stat{border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:12px}}
@media(max-width:800px){.layout.with-account{grid-template-columns:1fr}.account-sidebar{display:block}.account-nav-meta{display:none}}


/* ===== R3.2 navigation + account polish ===== */
body{
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
    line-height:1.45;
}
.nav{flex-wrap:wrap}
.nav-search{
    position:relative;
    flex:1 1 245px;
    min-width:210px;
    max-width:330px;
    gap:0;
}
.nav-search .input{
    height:46px;
    padding-left:42px;
    padding-right:78px;
    background:rgba(13,20,41,.92);
}
.nav-search-icon{
    position:absolute;
    z-index:2;
    left:15px;
    top:50%;
    transform:translateY(-50%);
    color:var(--muted);
    pointer-events:none;
}
.nav-search-btn{
    position:absolute;
    right:5px;
    top:5px;
    bottom:5px;
    padding:0 13px;
    border-radius:10px;
    font-size:12px;
}
.layout.with-account{
    grid-template-columns:230px minmax(0,1fr) 245px;
    align-items:start;
}
.layout.with-account .home-category-sidebar{
    grid-column:1;
    grid-row:1;
}
.layout.with-account .home-products-main{
    grid-column:2;
    grid-row:1;
    min-width:0;
}
.layout.with-account .account-sidebar{
    grid-column:3;
    grid-row:1;
    align-self:start;
    top:92px;
}
.account-sidebar{
    background:
      linear-gradient(180deg,rgba(124,58,237,.13),rgba(6,182,212,.05)),
      rgba(17,24,50,.95);
}
.account-side-head{
    padding-bottom:10px;
    border-bottom:1px solid rgba(255,255,255,.08);
}
.account-side-head h3{font-size:17px}
.account-side-stat b{font-variant-numeric:tabular-nums}
.account-side-stat.discount{
    border-bottom:0;
}

/* account.php */
.account-page{padding-top:34px}
.account-title-row{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:18px;
}
.account-title-row h2{
    margin:4px 0 0;
    font-size:30px;
}
.account-eyebrow{
    display:inline-block;
    color:#b9c4e8;
    font-size:13px;
    font-weight:800;
    letter-spacing:.04em;
}
.account-stats{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
    margin-bottom:18px;
}
.account-stat-card{
    padding:20px;
    min-height:112px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    border-radius:20px;
}
.account-stat-card span{
    color:var(--muted);
    font-size:13px;
    font-weight:700;
}
.account-stat-card strong{
    font-size:25px;
    font-weight:900;
    font-variant-numeric:tabular-nums;
}
.account-stat-card.discount strong{color:#86efac}
.account-section{
    border-radius:22px;
}
.account-section h3{
    margin-top:0;
    font-size:18px;
}
.account-section label{
    display:block;
    margin-top:10px;
    margin-bottom:5px;
    color:#cbd5e1;
    font-size:13px;
    font-weight:700;
}

@media(max-width:1120px){
    .layout.with-account{
        grid-template-columns:220px minmax(0,1fr);
    }
    .layout.with-account .home-category-sidebar{grid-column:1;grid-row:1}
    .layout.with-account .home-products-main{grid-column:2;grid-row:1}
    .layout.with-account .account-sidebar{
        grid-column:1/-1;
        grid-row:2;
        position:static;
        display:grid;
        grid-template-columns:repeat(4,1fr);
        gap:12px;
    }
    .account-side-head,.discount-note{grid-column:1/-1}
}
@media(max-width:900px){
    .account-stats{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:800px){
    .nav-search{order:3;flex-basis:100%;max-width:none;width:100%}
    .account-title-row{align-items:flex-start}
    .layout.with-account{grid-template-columns:1fr}
    .layout.with-account .home-category-sidebar,
    .layout.with-account .home-products-main,
    .layout.with-account .account-sidebar{grid-column:1;grid-row:auto}
    .layout.with-account .account-sidebar{display:block}
}
@media(max-width:520px){
    .account-stats{grid-template-columns:1fr}
}


/* =========================================================
   R3.3 UI CLEANUP - navigation, home account sidebar, account page
   ========================================================= */

/* Top navigation */
.topbar{
    background:rgba(9,14,30,.94);
    border-bottom:1px solid rgba(148,163,184,.12);
    box-shadow:0 8px 28px rgba(0,0,0,.16);
}
.nav-modern{
    max-width:1280px;
    min-height:78px;
    padding-top:12px;
    padding-bottom:12px;
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:nowrap;
}
.nav-modern .logo{
    flex:0 0 auto;
    display:flex;
    align-items:center;
    gap:9px;
    min-height:48px;
    padding:0 17px;
    border-radius:15px;
    font-size:16px;
    box-shadow:0 9px 24px rgba(124,58,237,.22);
}
.nav-modern .logo i{font-size:14px}

.nav-search{
    position:relative;
    flex:1 1 250px;
    min-width:190px;
    max-width:310px;
}
.nav-search .input{
    height:46px;
    padding:0 45px 0 40px;
    border-radius:15px;
    background:#0d152b;
    border:1px solid rgba(148,163,184,.18);
    font-size:13px;
}
.nav-search .input:focus{
    border-color:color-mix(in srgb,var(--pri) 65%,#fff 10%);
    box-shadow:0 0 0 3px rgba(124,58,237,.12);
}
.nav-search-icon{
    position:absolute;
    left:14px;
    top:50%;
    transform:translateY(-50%);
    color:#8290b3;
    z-index:2;
}
.nav-search-submit{
    position:absolute;
    right:6px;
    top:6px;
    width:34px;
    height:34px;
    border:0;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(135deg,var(--pri),var(--pri2));
    cursor:pointer;
}

.nav-links{
    display:flex;
    align-items:center;
    gap:6px;
}
.nav-link{
    height:44px;
    padding:0 12px;
    display:flex;
    align-items:center;
    gap:7px;
    border-radius:13px;
    color:#dbe4ff;
    background:rgba(30,41,75,.72);
    border:1px solid rgba(148,163,184,.08);
    font-size:13px;
    font-weight:800;
    white-space:nowrap;
    transition:.16s ease;
}
.nav-link:hover{
    transform:translateY(-1px);
    background:rgba(43,55,94,.95);
}
.nav-link i{color:#aebbe0;font-size:12px}

.pref-controls{
    flex:0 0 auto;
    display:flex;
    gap:5px;
}
.pref-controls select{
    min-width:66px;
    height:44px;
    padding:0 26px 0 10px;
    border-radius:12px;
    background:#0d152b;
    font-size:12px;
}

.nav-account{
    flex:0 0 auto;
    min-width:155px;
    max-width:200px;
    min-height:48px;
    padding:6px 10px;
    display:flex;
    align-items:center;
    gap:9px;
    border-radius:15px;
    background:linear-gradient(180deg,rgba(39,51,91,.96),rgba(27,37,70,.96));
    border:1px solid rgba(148,163,184,.12);
}
.nav-account:hover{border-color:rgba(124,58,237,.5)}
.nav-account-avatar{
    width:34px;
    height:34px;
    flex:0 0 34px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:linear-gradient(135deg,var(--pri),var(--pri2));
    color:#fff;
}
.nav-account-text{
    min-width:0;
    display:flex;
    flex-direction:column;
    line-height:1.2;
}
.nav-account-text small{
    color:#91a0c6;
    font-size:10px;
    font-weight:700;
}
.nav-account-text b{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:12px;
    color:#fff;
}
.nav-account-arrow{
    margin-left:auto;
    color:#8290b3;
    font-size:10px;
}
.nav-account.guest{min-width:auto;padding-right:14px}
.nav-deposit{
    height:44px;
    padding:0 13px;
    display:flex;
    align-items:center;
    gap:7px;
    border-radius:13px;
    background:linear-gradient(135deg,var(--pri),var(--pri2));
    color:#fff;
    font-weight:900;
    font-size:13px;
    white-space:nowrap;
    box-shadow:0 8px 22px rgba(124,58,237,.18);
}
.nav-logout{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:12px;
    background:rgba(30,41,75,.72);
    color:#dbe4ff;
}

/* Home layout: always keeps customer summary in the right column on desktop */
.home-layout{
    display:grid;
    grid-template-columns:230px minmax(0,1fr);
    gap:18px;
    align-items:start;
    margin-top:18px;
}
.home-layout.has-account{
    grid-template-columns:220px minmax(0,1fr) 250px;
}
.home-category-sidebar{
    grid-column:1;
    grid-row:1;
}
.home-products-main{
    grid-column:2;
    grid-row:1;
    min-width:0;
}
.home-layout .account-sidebar{
    grid-column:3;
    grid-row:1;
    position:sticky;
    top:96px;
    height:max-content;
    padding:0;
    overflow:hidden;
    border-radius:20px;
    background:linear-gradient(180deg,rgba(31,42,76,.96),rgba(19,28,53,.96));
    box-shadow:0 18px 42px rgba(0,0,0,.20);
}
.account-side-head{
    margin:0;
    padding:17px;
    display:flex;
    align-items:center;
    gap:11px;
    border-bottom:1px solid rgba(148,163,184,.12);
}
.account-side-avatar{
    width:42px;
    height:42px;
    flex:0 0 42px;
    display:grid;
    place-items:center;
    border-radius:14px;
    background:linear-gradient(135deg,var(--pri),var(--pri2));
}
.account-side-name{min-width:0}
.account-side-name span{
    display:block;
    color:#91a0c6;
    font-size:11px;
    font-weight:700;
}
.account-side-name h3{
    margin:2px 0 0;
    font-size:15px;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}
.account-side-grid{padding:8px 15px 2px}
.account-side-stat{
    padding:11px 0;
    display:block;
    border-bottom:1px solid rgba(148,163,184,.10);
}
.account-side-stat span{
    display:flex;
    align-items:center;
    gap:7px;
    margin-bottom:5px;
    color:#91a0c6;
    font-size:11px;
    font-weight:700;
}
.account-side-stat span i{width:13px;color:#8290b3}
.account-side-stat b{
    display:block;
    color:#f7f9ff;
    font-size:17px;
    line-height:1.15;
    font-variant-numeric:tabular-nums;
}
.account-side-stat.discount b{color:#86efac}
.discount-note{
    margin:10px 14px 0;
    padding:10px 11px;
    border-radius:12px;
}
.account-side-open{
    margin:14px;
    min-height:42px;
    padding:0 13px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-radius:12px;
    background:linear-gradient(135deg,var(--pri),var(--pri2));
    color:#fff;
    font-size:12px;
    font-weight:900;
}

/* Account page */
.account-page{
    max-width:1180px;
    padding-top:34px;
    padding-bottom:48px;
}
.account-title-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-bottom:20px;
}
.account-title-main{
    display:flex;
    align-items:center;
    gap:14px;
}
.account-page-avatar{
    width:54px;
    height:54px;
    flex:0 0 54px;
    display:grid;
    place-items:center;
    border-radius:17px;
    background:linear-gradient(135deg,var(--pri),var(--pri2));
    box-shadow:0 10px 28px rgba(124,58,237,.22);
    font-size:19px;
}
.account-title-row h2{
    margin:1px 0 2px;
    font-size:28px;
    line-height:1.15;
}
.account-eyebrow{
    display:block;
    color:#a8b4d4;
    font-size:12px;
    font-weight:800;
}
.account-subtitle{
    margin:4px 0 0;
    font-size:12px;
}
.account-back-btn{
    height:42px;
    padding:0 14px;
    display:flex;
    align-items:center;
    gap:8px;
    border-radius:12px;
    color:#dce4ff;
    background:#17213f;
    border:1px solid rgba(148,163,184,.12);
    font-size:12px;
    font-weight:800;
}

.account-stats{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
    margin:0 0 18px;
}
.account-stat-card{
    min-height:122px;
    padding:20px 21px;
    border-radius:20px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:9px;
    background:linear-gradient(160deg,rgba(37,48,83,.94),rgba(20,29,54,.94));
}
.account-stat-card span{
    color:#9cadd0;
    font-size:12px;
    font-weight:800;
}
.account-stat-card strong{
    color:#fff;
    font-size:24px;
    font-weight:900;
    letter-spacing:-.02em;
    font-variant-numeric:tabular-nums;
}
.account-stat-card.discount{
    background:linear-gradient(160deg,rgba(20,66,55,.75),rgba(20,29,54,.94));
}
.account-stat-card.discount strong{color:#86efac}

.account-settings-grid{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:16px;
    margin:0 0 20px;
}
.account-section{
    padding:22px;
    border-radius:20px;
    background:linear-gradient(180deg,rgba(31,42,75,.92),rgba(20,29,54,.92));
}
.account-section h3{
    display:flex;
    align-items:center;
    gap:9px;
    margin:0 0 17px;
    font-size:16px;
}
.section-icon{
    width:32px;
    height:32px;
    display:grid;
    place-items:center;
    border-radius:10px;
    background:rgba(124,58,237,.16);
    color:#c4b5fd;
}
.account-section form{
    display:grid;
    gap:7px;
}
.account-section label{
    margin:5px 0 0;
    color:#b9c5df;
    font-size:12px;
    font-weight:800;
}
.account-section .input{
    min-height:45px;
    margin:0;
    padding:11px 13px;
    background:#0c1429;
}
.account-section .btn{
    width:max-content;
    min-width:105px;
    margin-top:8px;
}
.account-section p{
    color:#aab6d3;
    line-height:1.55;
}
.account-page .table{
    margin-top:8px;
}
.account-page .table th{
    padding:0 12px 5px;
}
.account-page .table td{
    padding:13px 12px;
}

/* Responsive */
@media(max-width:1220px){
    .nav-modern{gap:7px}
    .nav-search{max-width:250px}
    .nav-link{padding:0 9px}
    .nav-link span{display:none}
    .home-layout.has-account{grid-template-columns:210px minmax(0,1fr) 235px}
}
@media(max-width:1020px){
    .nav-modern{flex-wrap:wrap}
    .nav-search{order:2;max-width:none;flex:1 1 300px}
    .nav-links{order:3}
    .pref-controls{order:3}
    .nav-account,.nav-deposit,.nav-logout{order:3}
    .home-layout.has-account{
        grid-template-columns:210px minmax(0,1fr);
    }
    .home-layout .account-sidebar{
        grid-column:1/-1;
        grid-row:2;
        position:static;
    }
    .account-side-grid{
        display:grid;
        grid-template-columns:repeat(4,1fr);
        gap:10px;
    }
    .account-side-stat{
        border:1px solid rgba(148,163,184,.1);
        border-radius:12px;
        padding:11px;
    }
}
@media(max-width:820px){
    .home-layout,
    .home-layout.has-account{
        grid-template-columns:1fr;
    }
    .home-category-sidebar,.home-products-main,.home-layout .account-sidebar{
        grid-column:1;
        grid-row:auto;
        position:static;
    }
    .account-stats{grid-template-columns:repeat(2,1fr)}
    .account-settings-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
    .nav-modern{padding:10px 14px}
    .nav-modern .logo span{display:none}
    .nav-modern .logo{width:46px;padding:0;justify-content:center}
    .nav-search{order:4;flex-basis:100%;max-width:none}
    .nav-link{width:42px;padding:0;justify-content:center}
    .nav-account{min-width:46px;width:46px;padding:6px;justify-content:center}
    .nav-account-text,.nav-account-arrow,.nav-account.guest b{display:none}
    .nav-deposit span{display:none}
    .account-title-row{align-items:flex-start}
    .account-subtitle{display:none}
    .account-stats{grid-template-columns:1fr 1fr}
}
@media(max-width:420px){
    .account-stats{grid-template-columns:1fr}
    .account-side-grid{grid-template-columns:1fr 1fr}
}


/* ===== Admin Settings spacing / layout ===== */
.settings-page{max-width:1120px;margin:0 auto;padding:8px 0 40px}
.settings-titlebar{margin:8px 0 20px;padding:20px 22px;border:1px solid rgba(148,163,184,.14);border-radius:18px;background:linear-gradient(135deg,rgba(124,58,237,.10),rgba(6,182,212,.05))}
.settings-titlebar h1{margin:5px 0 6px;font-size:28px;line-height:1.15}
.settings-titlebar p{margin:0;color:var(--muted);font-size:13px}
.settings-kicker{display:inline-flex;align-items:center;gap:7px;color:#aebde0;font-size:12px;font-weight:800}
.settings-form{display:grid;gap:18px}
.settings-section{padding:22px;border:1px solid rgba(148,163,184,.14);border-radius:18px;background:rgba(255,255,255,.035);box-shadow:0 10px 28px rgba(0,0,0,.08)}
.settings-section-head{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid rgba(148,163,184,.12)}
.settings-section-head h3{margin:0 0 3px;font-size:17px}
.settings-section-head p{margin:0;color:var(--muted);font-size:12px;line-height:1.45}
.settings-section-icon{width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(135deg,var(--pri),var(--pri2));color:#fff}
.settings-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px}
.settings-fields.three-col{grid-template-columns:repeat(3,minmax(0,1fr))}
.settings-field{display:flex;flex-direction:column;gap:8px;min-width:0}
.settings-field.full{grid-column:1/-1}
.settings-field label{display:block;margin:0;color:#e7ecfb;font-size:13px;font-weight:800;line-height:1.35}
.settings-field small{display:block;margin-top:1px;color:var(--muted);font-size:12px;line-height:1.55}
.settings-field input.input,.settings-field select,.settings-field textarea{width:100%;margin:0!important;min-height:46px;padding:11px 13px!important;border-radius:11px!important}
.settings-field textarea{min-height:94px;resize:vertical}
.settings-field.color-field .color-input{height:52px;padding:6px!important;cursor:pointer}
.cron-field code{display:block;overflow-x:auto;padding:13px 14px;border:1px solid rgba(148,163,184,.16);border-radius:11px;background:rgba(0,0,0,.16);color:#d8e2ff;white-space:nowrap;font-size:12px}
.settings-savebar{position:sticky;bottom:12px;z-index:5;display:flex;justify-content:flex-end;padding:12px 0}
.settings-savebar .btn{min-width:160px;min-height:46px;font-weight:900;box-shadow:0 10px 24px rgba(0,0,0,.18)}
@media(max-width:900px){.settings-fields.three-col{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.settings-page{padding-left:6px;padding-right:6px}.settings-section{padding:17px}.settings-fields,.settings-fields.three-col{grid-template-columns:1fr}.settings-titlebar{padding:17px}.settings-titlebar h1{font-size:23px}}