:root{
    --brand:#223f5f;
    --brand-2:#355f8e;
    --accent:#4cc28a;
    --bg:#f6f8fb;
    --panel:#ffffff;
    --card:#ffffff;
    --line:#dde6ee;
    --text:#243243;
    --ink:#223f5f;
    --muted:#6b7a8a;
    --radius:16px;
    --shadow:0 14px 30px rgba(0,0,0,0.07);
    --danger-bg:#fff1f1;
    --danger-line:#efc7c7;
    --danger-text:#9b2c2c;
    --ok-bg:#eefbf3;
    --ok-line:#bfe6cd;
    --ok-text:#23663f;
    --soft:#eef4fa;
    --shop-font:Arial, Helvetica, sans-serif;
}

*{
    box-sizing:border-box;
}

body{
    margin:0;
    font-family:Arial, Helvetica, sans-serif;
    background:var(--bg);
    color:var(--text);
}

body.shopfront-page{
    font-family:var(--shop-font);
}

a{
    color:inherit;
    text-decoration:none;
}

.container{
    width:min(1200px, calc(100% - 40px));
    margin:auto;
}

/* ==========================================================================
   SHARED SHOP HEADER
   Source: /public/shop/partials/header.php
   Also used by: /public/shop/product.php markup
   ========================================================================== */
.topbar{
    background:#fff;
    border-bottom:1px solid var(--line);
    position:sticky;
    top:0;
    z-index:50;
}

.top-inner{
    width:min(1240px, calc(100% - 24px));
    margin:auto;
    min-height:70px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
}

.brand{
    display:flex;
    align-items:center;
    gap:10px;
    font-weight:800;
    color:var(--brand);
    white-space:nowrap;
}

.brand img{
    width:34px;
    height:34px;
    border-radius:8px;
    object-fit:contain;
    background:#fff;
}

.nav{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    align-items:center;
}

.nav a{
    padding:8px 12px;
    border-radius:999px;
    font-weight:700;
    color:var(--brand);
    font-size:.9rem;
    white-space:nowrap;
}

.nav a:hover{
    background:#eef4fa;
}

.nav .community{
    background:var(--brand);
    color:#fff;
}

.nav .community:hover{
    background:var(--brand);
    color:#fff;
    opacity:.88;
}

/* ==========================================================================
   SHARED BUTTONS
   Source: shared across marketplace pages
   ========================================================================== */
.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    padding:0 14px;
    border-radius:10px;
    font-weight:700;
    text-decoration:none;
    border:0;
    cursor:pointer;
}

.btn-primary{
    background:var(--brand);
    color:#fff;
}

.btn-secondary{
    background:#eef4fa;
    color:var(--brand);
}

.btn-accent{
    background:var(--accent);
    color:#143728;
}

.btn-dark{
    background:rgba(0,0,0,.16);
    color:#fff;
    border:1px solid rgba(255,255,255,.18);
}

.btn-soft{
    background:var(--soft);
    color:var(--brand);
}

.btn.alt{
    background:#eef4f8;
    color:var(--ink);
}

/* ==========================================================================
   SHARED FOOTER
   Source: shared across marketplace pages
   ========================================================================== */
.footer{
    border-top:1px solid var(--line);
    padding:20px 0;
    margin-top:30px;
    color:var(--muted);
    background:#fff;
}

.shopfront-page .footer{
    margin-top:26px;
}

.footer-inner{
    display:flex;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
    align-items:center;
    min-height:70px;
}

.footer-brand{
    color:var(--brand);
    font-weight:700;
}

/* ==========================================================================
   SHOPS LIST PAGE
   Source: /public/shop/shops.php
   ========================================================================== */
.hero{
    padding:36px 0 26px;
}

.hero-box{
    background:linear-gradient(135deg,#223f5f,#355f8e);
    color:#fff;
    padding:36px;
    border-radius:20px;
}

.hero-box h1{
    margin:0 0 10px;
    font-size:clamp(2rem, 4vw, 3rem);
}

.hero-box p{
    margin:0;
    opacity:.93;
    max-width:760px;
    line-height:1.6;
}

.section{
    padding:10px 0 40px;
}

.section-head{
    margin-bottom:18px;
}

.section-head h2{
    margin:0;
    color:var(--brand);
}

.section-head p{
    margin:6px 0 0;
    color:var(--muted);
}

.notice{
    background:var(--danger-bg);
    border:1px solid var(--danger-line);
    color:var(--danger-text);
    border-radius:14px;
    padding:14px 16px;
    margin-bottom:16px;
    font-weight:700;
}

.notice.ok{
    background:var(--ok-bg);
    border-color:var(--ok-line);
    color:var(--ok-text);
}

.notice.error{
    background:var(--danger-bg);
    border-color:var(--danger-line);
    color:var(--danger-text);
}

.empty{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:var(--shadow);
    padding:22px;
    color:var(--muted);
}

.shop-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:18px;
}

.shop-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    overflow:hidden;
    box-shadow:var(--shadow);
}

.shop-banner{
    height:88px;
    background:linear-gradient(135deg, var(--shop-primary, #223f5f), var(--shop-accent, #4cc28a));
}

.shop-body{
    padding:18px;
}

.shop-title{
    margin:0 0 6px;
    color:var(--brand);
    font-size:1.12rem;
}

.shop-owner{
    color:var(--muted);
    font-size:.95rem;
    margin:0 0 10px;
}

.status{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:0 10px;
    border-radius:999px;
    background:#eef4fa;
    color:var(--brand);
    font-size:.82rem;
    font-weight:800;
    margin-bottom:14px;
}

.shop-bio{
    color:var(--muted);
    line-height:1.55;
    margin:0 0 14px;
    min-height:66px;
}

.shop-stats{
    display:flex;
    justify-content:space-between;
    gap:12px;
    color:var(--brand);
    font-weight:800;
    margin-bottom:14px;
    padding-top:14px;
    border-top:1px solid var(--line);
    flex-wrap:wrap;
}

/* ==========================================================================
   INDIVIDUAL SHOPFRONT PAGE
   Source: /public/shop/shop.php
   ========================================================================== */
.shopfront-page .hero{
    padding:28px 0 22px;
}

.shopfront-page .container{
    width:min(1200px, calc(100% - 32px));
}

.banner{
    background:linear-gradient(135deg, var(--brand), var(--accent));
    border-radius:22px;
    color:#fff;
    padding:34px;
    box-shadow:var(--shadow);
}

.banner h1{
    margin:0 0 8px;
    font-size:clamp(2rem, 4vw, 3rem);
}

.banner p{
    margin:0;
    opacity:.95;
    max-width:780px;
    line-height:1.6;
}

.meta{
    display:flex;
    gap:16px;
    flex-wrap:wrap;
    margin-top:16px;
    font-weight:700;
}

.panel{
    background:var(--panel);
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:var(--shadow);
    padding:22px;
}

.shopfront-page .section-head{
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:16px;
    margin-bottom:18px;
}

.products{
    display:grid;
    gap:18px;
}

.products-classic{
    grid-template-columns:repeat(3, 1fr);
}

.products-minimal{
    grid-template-columns:repeat(2, 1fr);
}

.products-grid{
    grid-template-columns:repeat(4, 1fr);
}

.product{
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    overflow:hidden;
}

.product-main-image{
    height:220px;
    background:linear-gradient(135deg,#eef4fa,#f8fbfd);
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--muted);
    font-weight:700;
}

.product-main-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.thumbs{
    display:flex;
    gap:8px;
    padding:10px 10px 0;
    flex-wrap:wrap;
}

.thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.product-body{
    padding:14px;
}

.product-title{
    margin:0 0 8px;
    color:var(--brand);
    font-weight:800;
    font-size:1.04rem;
}

.product-desc{
    color:var(--muted);
    margin:0 0 12px;
    line-height:1.5;
    min-height:44px;
}

.product-meta{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:center;
}

.price{
    color:var(--brand);
    font-weight:900;
}

.tag{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:0 10px;
    border-radius:999px;
    background:#eef4fa;
    color:var(--brand);
    font-size:.82rem;
    font-weight:800;
}

/* ==========================================================================
   PURCHASES PAGE
   Source: /public/shop/purchases.php
   ========================================================================== */
.purchases-page .wrap{
    max-width:1100px;
    margin:28px auto;
    padding:0 16px 40px;
}

.purchases-page .card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:18px;
    padding:18px;
    margin-bottom:18px;
}

.purchases-page h1{
    margin:0 0 14px;
}

.small{
    color:var(--muted);
    font-size:14px;
}

.purchases-page .order-head{
    display:flex;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
    margin-bottom:12px;
}

.badge{
    padding:4px 8px;
    border-radius:8px;
    background:#eef4f8;
    font-size:12px;
}

.purchases-page .item{
    display:grid;
    grid-template-columns:60px 1fr auto;
    gap:12px;
    align-items:center;
    padding:10px 0;
    border-bottom:1px solid #eef3f8;
}

.purchases-page .item:last-child{
    border-bottom:0;
}

.purchases-page .thumb{
    width:60px;
    height:60px;
    border-radius:10px;
    border:1px solid var(--line);
    background:#fff center/cover no-repeat;
}

.item-name{
    font-weight:700;
}

.item-meta{
    font-size:13px;
    color:var(--muted);
}

.item-total{
    font-weight:700;
}

.actions{
    margin-top:12px;
    display:flex;
    gap:10px;
}

.purchases-page .empty{
    text-align:center;
    padding:40px;
}

/* ==========================================================================
   ORDER PAGE
   Source: /public/shop/order.php
   ========================================================================== */
.order-page .wrap{
    max-width:1100px;
    margin:28px auto;
    padding:0 16px 40px;
}

.order-page .grid{
    display:grid;
    grid-template-columns:1.3fr .8fr;
    gap:18px;
}

.order-page .card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:18px;
    padding:18px;
    margin-bottom:18px;
}

.order-page h1,
.order-page h2,
.order-page h3{
    margin:0 0 12px;
}

.order-page .badges{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:10px;
}

.order-page .item{
    display:grid;
    grid-template-columns:64px 1fr auto;
    gap:12px;
    align-items:center;
    padding:12px 0;
    border-bottom:1px solid #eef3f8;
}

.order-page .item:last-child{
    border-bottom:0;
}

.order-page .thumb{
    width:64px;
    height:64px;
    border-radius:10px;
    border:1px solid var(--line);
    background:#fff center/cover no-repeat;
}

.order-page .summary-row{
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:8px 0;
}

.order-page .summary-row.total{
    border-top:1px solid var(--line);
    margin-top:8px;
    padding-top:14px;
    font-weight:700;
    font-size:18px;
}

.order-page .btns{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:14px;
}

.order-page .delivery-address{
    margin-top:12px;
}

.order-page .delivery-notes{
    margin-top:12px;
}

/* ==========================================================================
   PRODUCT PAGE
   Source: /public/shop/product.php
   ========================================================================== */
.product-page .page{
    padding:28px 0 40px;
}

.product-page .container{
    width:min(1200px, calc(100% - 32px));
}

.product-page .layout{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
}

.product-page .panel{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:var(--shadow);
    overflow:hidden;
    padding:0;
}

.product-page .main-image{
    height:420px;
    background:linear-gradient(135deg,#eef4fa,#f8fbfd);
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--muted);
    font-weight:700;
    cursor:pointer;
}

.product-page .main-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.product-page .thumbs{
    display:flex;
    gap:10px;
    padding:14px;
    flex-wrap:wrap;
    border-top:1px solid var(--line);
}

.product-page .thumb{
    width:86px;
    height:86px;
    border-radius:12px;
    overflow:hidden;
    border:1px solid var(--line);
    background:#f4f7fb;
    cursor:pointer;
}

.product-page .thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.product-page .details{
    padding:22px;
}

.product-page .shop-link{
    color:var(--muted);
    margin:0 0 8px;
}

.product-page .title{
    margin:0 0 12px;
    color:var(--brand);
    font-size:clamp(1.6rem, 3vw, 2.3rem);
}

.product-page .price{
    color:var(--brand);
    font-weight:900;
    font-size:1.4rem;
    margin-bottom:10px;
}

.product-page .desc{
    color:var(--muted);
    line-height:1.6;
    margin-bottom:14px;
}

.product-page .tag{
    display:inline-flex;
    align-items:center;
    min-height:32px;
    padding:0 10px;
    border-radius:999px;
    background:#eef4fa;
    color:var(--brand);
    font-size:.84rem;
    font-weight:800;
    margin-bottom:16px;
}

.product-page .buy-row{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    align-items:center;
}

.product-page .buy-row input{
    width:90px;
    min-height:44px;
    border:1px solid #ccd8e4;
    border-radius:12px;
    padding:10px 12px;
    font:inherit;
}

.product-page .btn{
    min-height:44px;
    border-radius:12px;
    border:0;
    cursor:pointer;
    text-decoration:none;
    font-weight:800;
}

.product-page .lightbox{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.86);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:999;
    padding:20px;
}

.product-page .lightbox.open{
    display:flex;
}

.product-page .lightbox img{
    max-width:95vw;
    max-height:90vh;
    border-radius:12px;
    box-shadow:0 20px 40px rgba(0,0,0,.3);
}

.product-page .lightbox-close{
    position:absolute;
    top:18px;
    right:22px;
    color:#fff;
    font-size:32px;
    cursor:pointer;
    font-weight:700;
}

/* ==========================================================================
   MARKETPLACE HOME PAGE
   Source: /public/shop/index.php
   ========================================================================== */
.marketplace-home{
    background:
        radial-gradient(circle at top right, rgba(76,194,138,.10), transparent 25%),
        linear-gradient(180deg,#f9fbfd 0%, #f6f8fb 100%);
}

.marketplace-home .container{
    width:min(1280px, calc(100% - 32px));
}

.marketplace-home .page{
    padding:28px 0 40px;
}

.marketplace-home .hero{
    display:grid;
    grid-template-columns:1.25fr .75fr;
    gap:18px;
    margin-bottom:22px;
    padding:0;
}

.marketplace-home .hero-main{
    background:linear-gradient(135deg,#223f5f,#355f8e);
    color:#fff;
    border-radius:24px;
    padding:34px;
    box-shadow:var(--shadow);
    position:relative;
    overflow:hidden;
}

.marketplace-home .hero-main::after{
    content:"";
    position:absolute;
    inset:auto -60px -60px auto;
    width:220px;
    height:220px;
    border-radius:50%;
    background:rgba(255,255,255,.08);
}

.marketplace-home .hero-main h1{
    margin:0 0 10px;
    font-size:clamp(2rem, 4vw, 3.2rem);
    line-height:1.05;
    position:relative;
    z-index:1;
}

.marketplace-home .hero-main p{
    margin:0;
    max-width:760px;
    opacity:.96;
    line-height:1.6;
    position:relative;
    z-index:1;
}

.marketplace-home .hero-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:18px;
    position:relative;
    z-index:1;
}

.marketplace-home .hero-side{
    display:grid;
    gap:16px;
}

.marketplace-home .side-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:20px;
    box-shadow:var(--shadow);
    padding:20px;
}

.marketplace-home .side-card h3{
    margin:0 0 8px;
    color:var(--brand);
    font-size:1.05rem;
}

.marketplace-home .side-card p{
    margin:0;
    color:var(--muted);
    line-height:1.55;
}

.marketplace-home .mini-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin-top:18px;
}

.marketplace-home .mini-stat{
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.14);
    border-radius:16px;
    padding:14px;
}

.marketplace-home .mini-stat strong{
    display:block;
    font-size:1.35rem;
    margin-bottom:4px;
}

.marketplace-home .notice{
    background:var(--danger-bg);
    border:1px solid var(--danger-line);
    color:var(--danger-text);
    border-radius:14px;
    padding:14px 16px;
    margin-bottom:16px;
    font-weight:700;
}

.marketplace-home .section{
    padding:8px 0 26px;
}

.marketplace-home .section-head{
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:16px;
    margin-bottom:18px;
}

.marketplace-home .section-head h2{
    margin:0;
    color:var(--brand);
    font-size:1.7rem;
}

.marketplace-home .section-head p{
    margin:6px 0 0;
    color:var(--muted);
}

.marketplace-home .quick-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px;
    margin-bottom:10px;
}

.marketplace-home .quick-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:var(--shadow);
    padding:18px;
    transition:transform .15s ease, box-shadow .15s ease;
}

.marketplace-home .quick-card:hover,
.marketplace-home .product-card:hover,
.marketplace-home .shop-card:hover{
    transform:translateY(-3px);
    box-shadow:0 18px 34px rgba(0,0,0,0.09);
}

.marketplace-home .quick-card h3{
    margin:0 0 8px;
    color:var(--brand);
    font-size:1.02rem;
}

.marketplace-home .quick-card p{
    margin:0 0 12px;
    color:var(--muted);
    line-height:1.5;
    min-height:68px;
}

.marketplace-home .product-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
}

.marketplace-home .product-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:var(--shadow);
    overflow:hidden;
    transition:transform .15s ease, box-shadow .15s ease;
}

.marketplace-home .product-media{
    height:210px;
    background:linear-gradient(135deg,#eef4fa,#f8fbfd);
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--muted);
    font-weight:700;
}

.marketplace-home .product-media img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.marketplace-home .product-body{
    padding:14px;
}

.marketplace-home .product-shop{
    font-size:.9rem;
    color:var(--muted);
    margin:0 0 6px;
}

.marketplace-home .product-title{
    margin:0 0 8px;
    color:var(--brand);
    font-size:1.04rem;
    font-weight:800;
    line-height:1.35;
    min-height:46px;
}

.marketplace-home .product-desc{
    margin:0 0 12px;
    color:var(--muted);
    line-height:1.5;
    min-height:42px;
}

.marketplace-home .product-meta{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    margin-bottom:12px;
}

.marketplace-home .product-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

.marketplace-home .price{
    color:var(--brand);
    font-weight:900;
    font-size:1.05rem;
}

.marketplace-home .tag{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:0 10px;
    border-radius:999px;
    background:#eef4fa;
    color:var(--brand);
    font-size:.82rem;
    font-weight:800;
}

.marketplace-home .shop-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
}

.marketplace-home .shop-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    overflow:hidden;
    box-shadow:var(--shadow);
    transition:transform .15s ease, box-shadow .15s ease;
}

.marketplace-home .shop-banner{
    height:96px;
    background:linear-gradient(135deg, var(--shop-primary, #223f5f), var(--shop-accent, #4cc28a));
}

.marketplace-home .shop-body{
    padding:18px;
}

.marketplace-home .shop-title{
    margin:0 0 6px;
    color:var(--brand);
    font-size:1.1rem;
}

.marketplace-home .shop-bio{
    color:var(--muted);
    line-height:1.55;
    margin:0 0 12px;
    min-height:72px;
}

.marketplace-home .shop-stats{
    display:flex;
    justify-content:space-between;
    gap:10px;
    flex-wrap:wrap;
    color:var(--brand);
    font-weight:800;
    padding-top:12px;
    border-top:1px solid var(--line);
    margin-bottom:14px;
}

.marketplace-home .empty{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:var(--shadow);
    padding:20px;
    color:var(--muted);
}

.marketplace-home .seller-cta{
    background:linear-gradient(135deg,#1f3a57 0%, #2e577f 100%);
    color:#fff;
    border-radius:22px;
    box-shadow:var(--shadow);
    padding:26px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
    flex-wrap:wrap;
    margin-top:10px;
}

.marketplace-home .seller-cta h2{
    margin:0 0 8px;
    font-size:1.75rem;
}

.marketplace-home .seller-cta p{
    margin:0;
    color:rgba(255,255,255,.9);
    max-width:760px;
    line-height:1.6;
}

.marketplace-home .seller-cta-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}


/* ==========================================================================
   CHECKOUT PAGE
   Source: /public/shop/checkout.php
   ========================================================================== */
.checkout-page .checkout-wrap{
    max-width:1200px;
    margin:24px auto;
    padding:0 16px 40px;
}

.checkout-page .checkout-grid{
    display:grid;
    grid-template-columns:1.35fr .8fr;
    gap:20px;
}

.checkout-page .card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:18px;
    padding:18px;
    box-shadow:var(--shadow);
}

.checkout-page .checkout-card-spaced{
    margin-bottom:20px;
}

.checkout-page .small{
    color:var(--muted);
    font-size:14px;
}

.checkout-page .alert{
    border-radius:12px;
    padding:12px 14px;
    margin:0 0 14px;
    border:1px solid;
}

.checkout-page .alert.err{
    background:#fff3f2;
    color:#b42318;
    border-color:#f3c6c2;
}

.checkout-page .alert.warn{
    background:var(--warn-bg);
    border-color:var(--warn-line);
    color:#7a5a00;
}

.checkout-page .checkout-alert-no-margin{
    margin-bottom:0;
}

.checkout-page .shop-block{
    border:1px solid var(--line);
    border-radius:16px;
    overflow:hidden;
    margin-bottom:16px;
}

.checkout-page .shop-head{
    padding:14px 16px;
    background:#f8fbfe;
    border-bottom:1px solid var(--line);
    font-weight:700;
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:center;
    flex-wrap:wrap;
}

.checkout-page .shop-head a{
    color:var(--ink);
    text-decoration:none;
}

.checkout-page .item{
    display:grid;
    grid-template-columns:70px 1fr auto;
    gap:14px;
    padding:14px 16px;
    align-items:center;
    border-bottom:1px solid #eef3f8;
}

.checkout-page .item:last-child{
    border-bottom:0;
}

.checkout-page .thumb{
    width:70px;
    height:70px;
    border-radius:12px;
    border:1px solid var(--line);
    background:#fff center/cover no-repeat;
}

.checkout-page .item-name{
    font-weight:700;
    margin-bottom:6px;
}

.checkout-page .item-meta{
    font-size:14px;
    color:var(--muted);
}

.checkout-page .item-total{
    font-weight:700;
    white-space:nowrap;
}

.checkout-page .shop-subtotal{
    padding:12px 16px;
    border-top:1px solid var(--line);
    background:#fcfdff;
    text-align:right;
    font-weight:700;
}

.checkout-page .form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.checkout-page .form-grid .full{
    grid-column:1 / -1;
}

.checkout-page label{
    display:block;
    font-size:14px;
    font-weight:700;
    margin-bottom:6px;
}

.checkout-page input,
.checkout-page select,
.checkout-page textarea{
    width:100%;
    border:1px solid var(--line);
    border-radius:12px;
    padding:12px 13px;
    font-size:15px;
    background:#fff;
}

.checkout-page textarea{
    min-height:96px;
    resize:vertical;
}

.checkout-page .payment-option{
    border:1px solid var(--line);
    border-radius:14px;
    padding:12px 14px;
    margin-bottom:10px;
    display:flex;
    gap:10px;
    align-items:flex-start;
}

.checkout-page .payment-option input{
    width:auto;
    margin-top:3px;
}

.checkout-page .summary-row{
    display:flex;
    justify-content:space-between;
    gap:14px;
    padding:8px 0;
    font-size:15px;
}

.checkout-page .summary-row.total{
    font-size:18px;
    font-weight:700;
    border-top:1px solid var(--line);
    margin-top:8px;
    padding-top:14px;
}

.checkout-page .btns{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:16px;
}

.checkout-page .checkout-btns-center{
    justify-content:center;
}

.checkout-page .empty{
    text-align:center;
    padding:36px 20px;
}

.checkout-page .note{
    margin-top:10px;
    color:var(--muted);
    font-size:13px;
    line-height:1.5;
}

.checkout-page .checkout-summary-sticky{
    position:sticky;
    top:20px;
}

.checkout-page .checkout-error-text{
    margin-top:12px;
    color:#b42318;
}

/* ==========================================================================
   CART PAGE
   Source: /public/shop/cart.php
   ========================================================================== */
.cart-page .wrap{
    max-width:1180px;
    margin:28px auto;
    padding:0 16px 40px;
}

.cart-page .grid{
    display:grid;
    grid-template-columns:1.35fr .8fr;
    gap:20px;
}

.cart-page .card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:18px;
    padding:18px;
}

.cart-page h1,
.cart-page h2,
.cart-page h3{
    margin:0 0 12px;
}

.cart-page .small{
    color:var(--muted);
    font-size:14px;
}

.cart-page .alert{
    border-radius:12px;
    padding:12px 14px;
    margin-bottom:14px;
    border:1px solid;
}

.cart-page .alert.warn{
    background:var(--warn-bg);
    border-color:var(--warn-line);
}

.cart-page .alert.err{
    background:#fff3f2;
    border-color:#f3c6c2;
    color:var(--danger);
}

.cart-page .shop-block{
    border:1px solid var(--line);
    border-radius:16px;
    overflow:hidden;
    margin-bottom:16px;
}

.cart-page .shop-head{
    padding:14px 16px;
    background:#f8fbfe;
    border-bottom:1px solid var(--line);
    font-weight:700;
}

.cart-page .item{
    display:grid;
    grid-template-columns:86px 1fr auto;
    gap:14px;
    align-items:center;
    padding:14px 16px;
    border-bottom:1px solid #eef3f8;
}

.cart-page .item:last-child{
    border-bottom:0;
}

.cart-page .thumb{
    width:86px;
    height:86px;
    border-radius:12px;
    border:1px solid var(--line);
    background:#fff center/cover no-repeat;
}

.cart-page .item-name{
    font-weight:700;
    margin-bottom:6px;
}

.cart-page .item-meta{
    font-size:14px;
    color:var(--muted);
    margin-bottom:10px;
}

.cart-page .qty-row{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    align-items:center;
}

.cart-page .qty-box{
    display:flex;
    gap:8px;
    align-items:center;
}

.cart-page .qty-input{
    width:76px;
    border:1px solid var(--line);
    border-radius:10px;
    padding:10px 12px;
}

.cart-page .btn{
    font-size:14px;
    padding:11px 14px;
}

.cart-page .btn-danger{
    background:#fff1f0;
    color:var(--danger);
}

.cart-page .item-total{
    text-align:right;
    white-space:nowrap;
}

.cart-page .item-total strong{
    font-size:18px;
}

.cart-page .shop-subtotal{
    padding:12px 16px;
    border-top:1px solid var(--line);
    background:#fcfdff;
    text-align:right;
    font-weight:700;
}

.cart-page .summary-row{
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:8px 0;
}

.cart-page .summary-row.total{
    border-top:1px solid var(--line);
    margin-top:8px;
    padding-top:14px;
    font-size:18px;
    font-weight:700;
}

.cart-page .actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:16px;
}

.cart-page .cart-actions-center{
    justify-content:center;
}

.cart-page .empty{
    text-align:center;
    padding:44px 18px;
}

.cart-page .cart-summary-sticky{
    position:sticky;
    top:20px;
}

/* ==========================================================================
   SELLER LANDING PAGE
   Source: /public/shop/become-a-seller.php
   ========================================================================== */
.seller-landing-page .wrap{
    max-width:1080px;
    margin:24px auto;
    padding:0 16px 40px;
}

.seller-landing-page .hero,
.seller-landing-page .card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:22px;
    box-shadow:var(--shadow);
}

.seller-landing-page .hero{
    padding:28px;
    margin-bottom:18px;
    background:linear-gradient(135deg,#223f5f,#355f8e);
    color:#fff;
}

.seller-landing-page .hero h1{
    margin:0 0 10px;
    font-size:clamp(2rem,4vw,3rem);
}

.seller-landing-page .hero p{
    margin:0;
    line-height:1.7;
    max-width:900px;
}

.seller-landing-page .grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
}

.seller-landing-page .card{
    padding:20px;
}

.seller-landing-page h2{
    margin:0 0 12px;
}

.seller-landing-page h3{
    margin:0 0 8px;
    font-size:16px;
}

.seller-landing-page ul{
    margin:0;
    padding-left:18px;
    line-height:1.75;
}

.seller-landing-page .small{
    color:var(--muted);
    font-size:14px;
}

.seller-landing-page .alert{
    border-radius:12px;
    padding:12px 14px;
    margin-bottom:14px;
    border:1px solid;
}

.seller-landing-page .alert.error{
    background:#fff3f2;
    border-color:#f3c6c2;
    color:var(--danger);
}

.seller-landing-page .checks{
    display:grid;
    gap:12px;
    margin-top:14px;
}

.seller-landing-page .check{
    display:flex;
    gap:10px;
    align-items:flex-start;
    padding:14px;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
}

.seller-landing-page .check input{
    width:auto;
    margin-top:3px;
}

.seller-landing-page .check strong{
    display:block;
    margin-bottom:4px;
}

.seller-landing-page .muted-box{
    margin-top:14px;
    padding:14px;
    border:1px solid var(--line);
    border-radius:14px;
    background:#f8fbfe;
    line-height:1.7;
    font-size:14px;
    color:var(--ink);
}

.seller-landing-page .actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:18px;
}

.seller-landing-page .policy-list{
    display:grid;
    gap:14px;
}

.seller-landing-page .policy-item{
    border:1px solid var(--line);
    border-radius:14px;
    padding:14px;
    background:#fcfdff;
}

/* ==========================================================================
   SELLER ONBOARDING PAGE
   ========================================================================== */

.seller-onboarding-page{
    background:#f6f8fb;
    color:#223f5f;
}

.shop-onboarding-wrap{
    max-width:1100px;
    margin:24px auto 40px;
    padding:0 16px;
}

.shop-onboarding-hero,
.shop-gateway-card,
.shop-onboarding-note,
.shop-onboarding-footer-card{
    background:#fff;
    border:1px solid #dbe4ee;
    border-radius:22px;
    box-shadow:0 14px 30px rgba(0,0,0,.07);
}

.shop-onboarding-hero{
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(280px,0.9fr);
    gap:18px;
    padding:24px;
    margin-bottom:18px;
}

.shop-eyebrow{
    margin:0 0 8px;
    font-size:12px;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:#4cc28a;
}

.shop-onboarding-hero h1,
.shop-onboarding-footer-card h2,
.shop-gateway-card h2{
    margin:0 0 10px;
}

.shop-onboarding-lead{
    margin:0;
    color:#6b7280;
    line-height:1.65;
}

.shop-onboarding-shopmeta{
    border:1px solid #dbe4ee;
    border-radius:18px;
    background:#f8fbfd;
    padding:18px;
    align-self:start;
}

.shop-onboarding-shopmeta-label{
    font-size:12px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:8px;
}

.shop-onboarding-shopmeta-name{
    font-size:20px;
    font-weight:800;
    margin-bottom:6px;
    color:#223f5f;
}

.shop-onboarding-shopmeta-slug{
    font-size:14px;
    color:#6b7280;
    word-break:break-word;
}

.shop-onboarding-shopmeta-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:16px;
}

.shop-onboarding-note{
    padding:16px 18px;
    margin-bottom:18px;
}

.shop-onboarding-note p{
    margin:0;
    color:#506174;
    line-height:1.6;
}

.shop-onboarding-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:18px;
    margin-bottom:18px;
}

.shop-gateway-card{
    padding:22px;
}

.shop-gateway-card-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:12px;
}

.shop-gateway-copy{
    margin:0 0 16px;
    color:#6b7280;
    line-height:1.6;
}

.shop-status-pill{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:0 10px;
    border-radius:999px;
    background:#eef4f8;
    color:#223f5f;
    font-size:13px;
    font-weight:800;
    white-space:nowrap;
}

.shop-status-pill.ok{
    background:#eefbf3;
    color:#23663f;
}

.shop-status-pill.warn{
    background:#fff8e8;
    color:#7a5a00;
}

.shop-gateway-meta{
    display:grid;
    gap:8px;
    margin:14px 0 0;
    color:#506174;
    font-size:14px;
}

.shop-gateway-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:18px;
}

.shop-onboarding-footer-card{
    padding:22px;
}

.shop-onboarding-footer-card p{
    margin:0;
    color:#6b7280;
    line-height:1.6;
}

.shop-alert{
    border-radius:12px;
    padding:12px 14px;
    margin-bottom:14px;
    border:1px solid;
}

.shop-alert.success{
    background:#eefbf3;
    border-color:#bfe6cd;
    color:#23663f;
}

.shop-alert.error{
    background:#fff3f2;
    border-color:#f3c6c2;
    color:#b42318;
}

@media (max-width: 860px){
    .shop-onboarding-hero{
        grid-template-columns:1fr;
    }

    .shop-onboarding-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width: 640px){
    .shop-onboarding-wrap{
        margin:18px auto 32px;
    }

    .shop-onboarding-hero,
    .shop-gateway-card,
    .shop-onboarding-note,
    .shop-onboarding-footer-card{
        border-radius:18px;
    }

    .shop-onboarding-hero,
    .shop-gateway-card,
    .shop-onboarding-footer-card{
        padding:18px;
    }

    .shop-gateway-card-head{
        flex-direction:column;
        align-items:flex-start;
    }

    .shop-gateway-actions,
    .shop-onboarding-shopmeta-actions{
        flex-direction:column;
    }

    .shop-gateway-actions .btn,
    .shop-onboarding-shopmeta-actions .btn{
        width:100%;
    }
}

/* ==========================================================================
   SELLER DASHBOARD
   ========================================================================== */

.seller-dashboard-page{
    margin:0;
    background:#f6f8fb;
    color:#243243;
    font-family:Arial, Helvetica, sans-serif;
}

.shop-container{
    width:min(1240px, calc(100% - 32px));
    margin:auto;
}

.seller-dashboard-topbar{
    background:#fff;
    border-bottom:1px solid #dde6ee;
    position:sticky;
    top:0;
    z-index:20;
}

.seller-dashboard-top-inner{
    min-height:74px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
}

.seller-dashboard-brand{
    display:flex;
    align-items:center;
    gap:12px;
    color:#223f5f;
    font-weight:800;
    text-decoration:none;
}

.seller-dashboard-brand img{
    width:40px;
    height:40px;
    border-radius:8px;
    object-fit:contain;
    background:#fff;
}

.seller-dashboard-nav{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
}

.seller-dashboard-nav a{
    padding:10px 14px;
    border-radius:999px;
    color:#223f5f;
    font-weight:700;
    text-decoration:none;
    transition:background-color .15s ease, opacity .15s ease;
}

.seller-dashboard-nav a:hover{
    background:#eef4fa;
}

.seller-dashboard-nav a.community{
    background:#223f5f;
    color:#fff;
}

.seller-dashboard-nav a.community:hover{
    background:#223f5f;
    color:#fff;
    opacity:.88;
}

.seller-dashboard-page-main{
    padding:28px 0 40px;
}

.seller-dashboard-notice{
    background:#eefbf3;
    border:1px solid #bfe6cd;
    color:#23663f;
    border-radius:14px;
    padding:14px 16px;
    margin-bottom:16px;
    font-weight:700;
}

.seller-dashboard-hero{
    background:linear-gradient(135deg, var(--shop-theme-primary, #223f5f), var(--shop-theme-accent, #4cc28a));
    color:#fff;
    border-radius:22px;
    padding:30px;
    box-shadow:0 14px 30px rgba(0,0,0,0.07);
    margin-bottom:22px;
}

.seller-dashboard-hero h1{
    margin:0 0 8px;
    font-size:clamp(2rem, 4vw, 3rem);
}

.seller-dashboard-hero p{
    margin:0;
    max-width:760px;
    opacity:.95;
    line-height:1.6;
}

.seller-dashboard-hero-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:18px;
}

.seller-dashboard-grid{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:20px;
}

.seller-dashboard-panel{
    background:#fff;
    border:1px solid #dde6ee;
    border-radius:18px;
    box-shadow:0 14px 30px rgba(0,0,0,0.07);
    padding:20px;
}

.seller-dashboard-sidebar h3,
.seller-dashboard-section-title{
    margin:0 0 14px;
    color:#223f5f;
}

.seller-dashboard-menu{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.seller-dashboard-menu a{
    display:block;
    padding:12px 14px;
    border-radius:12px;
    background:#f8fbff;
    border:1px solid #dbe7f1;
    color:#223f5f;
    font-weight:700;
    text-decoration:none;
}

.seller-dashboard-menu a:hover{
    background:#eef4fa;
}

.seller-dashboard-status-wrap{
    margin-top:18px;
}

.seller-dashboard-chip{
    display:inline-flex;
    align-items:center;
    min-height:32px;
    padding:0 10px;
    border-radius:999px;
    background:#eef4fa;
    color:#223f5f;
    font-size:.84rem;
    font-weight:800;
}

.seller-dashboard-stats{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:16px;
    margin-bottom:20px;
}

.seller-dashboard-stat{
    background:#fff;
    border:1px solid #dde6ee;
    border-radius:16px;
    box-shadow:0 14px 30px rgba(0,0,0,0.07);
    padding:18px;
}

.seller-dashboard-stat-label{
    color:#6b7a8a;
    font-size:.92rem;
    margin-bottom:8px;
}

.seller-dashboard-stat-value{
    color:#223f5f;
    font-size:1.7rem;
    font-weight:900;
}

.seller-dashboard-split{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:20px;
}

.seller-dashboard-list{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.seller-dashboard-product-row{
    display:grid;
    grid-template-columns:1fr auto auto;
    gap:12px;
    align-items:center;
    padding:14px;
    border:1px solid #dde6ee;
    border-radius:14px;
    background:#fff;
}

.seller-dashboard-product-row h4{
    margin:0 0 4px;
    color:#223f5f;
}

.seller-dashboard-product-row p{
    margin:0;
    color:#6b7a8a;
    font-size:.93rem;
}

.seller-dashboard-pill{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:0 10px;
    border-radius:999px;
    background:#eef4fa;
    color:#223f5f;
    font-size:.82rem;
    font-weight:800;
}

.seller-dashboard-price{
    font-weight:900;
    color:#223f5f;
}

.seller-dashboard-product-tags{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.seller-dashboard-meta-list{
    display:grid;
    gap:12px;
}

.seller-dashboard-meta-item{
    border:1px solid #dde6ee;
    border-radius:14px;
    padding:14px;
    background:#fff;
}

.seller-dashboard-meta-item strong{
    display:block;
    color:#223f5f;
    margin-bottom:6px;
}

.seller-dashboard-empty{
    border:1px dashed #cdd9e4;
    border-radius:14px;
    padding:18px;
    background:#fbfdff;
    color:#6b7a8a;
}

.seller-dashboard-footer{
    margin-top:30px;
    border-top:1px solid #dde6ee;
    background:#fff;
}

.seller-dashboard-footer-inner{
    min-height:68px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
    color:#6b7a8a;
}

.seller-dashboard-footer-brand{
    color:#223f5f;
    font-weight:700;
}

@media (max-width: 1100px){
    .seller-dashboard-stats{
        grid-template-columns:repeat(2, 1fr);
    }

    .seller-dashboard-split{
        grid-template-columns:1fr;
    }
}

@media (max-width: 860px){
    .seller-dashboard-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width: 640px){
    .shop-container{
        width:min(1240px, calc(100% - 24px));
    }

    .seller-dashboard-top-inner,
    .seller-dashboard-footer-inner{
        flex-direction:column;
        align-items:flex-start;
    }

    .seller-dashboard-stats{
        grid-template-columns:1fr;
    }

    .seller-dashboard-product-row{
        grid-template-columns:1fr;
    }

    .seller-dashboard-hero-actions{
        flex-direction:column;
    }

    .seller-dashboard-hero-actions .btn{
        width:100%;
    }
}

/* ==========================================================================
   SHOP BUILDER / SHOP SETTINGS
   ========================================================================== */

.shop-builder-page{
    background:#f6f8fb;
    color:#243243;
    font-family:Arial, Helvetica, sans-serif;
}

.shop-builder-wrap{
    max-width:1400px;
    margin:24px auto 40px;
    padding:0 16px;
}

.shop-builder-topbar{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    padding:22px 24px;
    background:#fff;
    border:1px solid #dde6ee;
    border-radius:20px;
    box-shadow:0 14px 30px rgba(0,0,0,0.07);
    margin-bottom:18px;
}

.shop-builder-topbar-copy h1{
    margin:0 0 8px;
    color:#223f5f;
}

.shop-builder-topbar-copy p{
    margin:0;
    color:#6b7a8a;
    line-height:1.6;
    max-width:760px;
}

.shop-builder-topbar-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

.shop-builder-eyebrow{
    margin:0 0 8px;
    font-size:12px;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:#4cc28a;
}

.shop-builder-layout{
    display:grid;
    grid-template-columns:360px minmax(0, 1fr);
    gap:20px;
    align-items:start;
}

.shop-builder-sidebar{
    position:sticky;
    top:90px;
    max-height:calc(100vh - 120px);
}

.shop-builder-sidebar-inner{
    display:flex;
    flex-direction:column;
    gap:16px;
}

.shop-builder-section{
    background:#fff;
    border:1px solid #dde6ee;
    border-radius:18px;
    box-shadow:0 14px 30px rgba(0,0,0,0.07);
    padding:18px;
}

.shop-builder-section-head{
    margin-bottom:14px;
}

.shop-builder-section-head h2{
    margin:0 0 4px;
    font-size:1.05rem;
    color:#223f5f;
}

.shop-builder-section-head span{
    display:block;
    color:#6b7a8a;
    font-size:.92rem;
}

.shop-builder-section label{
    display:block;
    margin:12px 0 6px;
    font-weight:700;
    color:#223f5f;
}

.shop-builder-section input[type="text"],
.shop-builder-section textarea,
.shop-builder-section select{
    width:100%;
    padding:12px 13px;
    border:1px solid #d9e4ed;
    border-radius:12px;
    background:#fff;
    color:#243243;
    font:inherit;
}

.shop-builder-section textarea{
    resize:vertical;
    min-height:120px;
}

.shop-builder-field-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.shop-builder-color{
    width:100%;
    min-height:48px;
    padding:6px;
    border:1px solid #d9e4ed;
    border-radius:12px;
    background:#fff;
}

.shop-builder-layout-cards{
    display:grid;
    gap:10px;
    margin-top:14px;
}

.shop-layout-card{
    padding:12px 14px;
    border:1px solid #dde6ee;
    border-radius:14px;
    background:#f9fbfd;
}

.shop-layout-card strong{
    display:block;
    color:#223f5f;
    margin-bottom:4px;
}

.shop-layout-card span{
    display:block;
    color:#6b7a8a;
    font-size:.92rem;
    line-height:1.5;
}

.shop-layout-card.active{
    border-color:#4cc28a;
    box-shadow:0 0 0 2px rgba(76,194,138,0.14) inset;
}

.shop-builder-toggle{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:12px;
    border:1px solid #dde6ee;
    border-radius:14px;
    background:#fbfdff;
    margin-top:10px;
}

.shop-builder-toggle input{
    margin-top:3px;
}

.shop-builder-toggle span{
    display:block;
}

.shop-builder-toggle strong{
    display:block;
    color:#223f5f;
    margin-bottom:4px;
}

.shop-builder-toggle small{
    display:block;
    color:#6b7a8a;
    line-height:1.5;
}

.shop-builder-section-future{
    background:linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

.shop-builder-future-list{
    margin:0;
    padding-left:18px;
    color:#506174;
    line-height:1.8;
}

.shop-builder-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    padding:16px 18px;
    background:#fff;
    border:1px solid #dde6ee;
    border-radius:18px;
    box-shadow:0 14px 30px rgba(0,0,0,0.07);
    margin-top:0;
    flex:0 0 auto;
}

.shop-builder-preview-area{
    background:#fff;
    border:1px solid #dde6ee;
    border-radius:20px;
    box-shadow:0 14px 30px rgba(0,0,0,0.07);
    padding:18px;
    min-width:0;
}

.shop-builder-preview-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:16px;
}

.shop-builder-preview-head h2{
    margin:0;
    color:#223f5f;
}

.shop-builder-preview-badge{
    display:inline-flex;
    align-items:center;
    min-height:32px;
    padding:0 10px;
    border-radius:999px;
    background:#eef4fa;
    color:#223f5f;
    font-size:.84rem;
    font-weight:800;
    white-space:nowrap;
}

.shop-preview-shell{
    border:1px solid #dde6ee;
    border-radius:22px;
    background:#f8fbff;
    overflow:hidden;
    font-family:var(--preview-font, Arial, Helvetica, sans-serif);
}

.shop-preview-topbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:16px 18px;
    background:#fff;
    border-bottom:1px solid #dde6ee;
}

.shop-preview-brand{
    display:flex;
    align-items:center;
    gap:12px;
}

.shop-preview-brand strong{
    display:block;
    color:#223f5f;
}

.shop-preview-brand span{
    display:block;
    color:#6b7a8a;
    font-size:.9rem;
}

.shop-preview-logo{
    width:42px;
    height:42px;
    border-radius:12px;
    background:linear-gradient(135deg, var(--preview-primary, #223f5f), var(--preview-accent, #4cc28a));
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:900;
}

.shop-preview-nav{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    color:#506174;
    font-weight:700;
    font-size:.95rem;
}

.shop-preview-hero{
    display:grid;
    grid-template-columns:minmax(0, 1.2fr) minmax(260px, .8fr);
    gap:18px;
    padding:22px;
    background:linear-gradient(135deg, color-mix(in srgb, var(--preview-primary, #223f5f) 92%, white 8%), color-mix(in srgb, var(--preview-accent, #4cc28a) 88%, white 12%));
    color:#fff;
}

.shop-preview-kicker{
    margin:0 0 8px;
    text-transform:uppercase;
    font-size:.78rem;
    letter-spacing:.12em;
    font-weight:800;
    opacity:.9;
}

.shop-preview-hero-copy h3{
    margin:0 0 10px;
    font-size:clamp(1.6rem, 2vw, 2.4rem);
}

.shop-preview-hero-copy p{
    margin:0;
    line-height:1.65;
    opacity:.96;
}

.shop-preview-hero-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:18px;
}

.shop-preview-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:0 14px;
    border-radius:12px;
    font-weight:800;
}

.shop-preview-btn.primary{
    background:#fff;
    color:var(--preview-primary, #223f5f);
}

.shop-preview-btn.secondary{
    background:rgba(255,255,255,.16);
    color:#fff;
    border:1px solid rgba(255,255,255,.22);
}

.shop-preview-hero-card{
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.18);
    border-radius:18px;
    padding:16px;
    backdrop-filter:blur(6px);
    align-self:start;
}

.shop-preview-stat + .shop-preview-stat{
    margin-top:12px;
}

.shop-preview-stat strong{
    display:block;
    margin-bottom:2px;
    font-size:1rem;
}

.shop-preview-stat span{
    display:block;
    font-size:.9rem;
    opacity:.92;
}

.shop-preview-section{
    padding:20px;
    background:#fff;
    border-top:1px solid #ecf1f5;
}

.shop-preview-section-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:14px;
}

.shop-preview-section-head h4{
    margin:0;
    color:#223f5f;
}

.shop-preview-section-head span{
    color:#6b7a8a;
    font-size:.9rem;
}

.shop-preview-products{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:14px;
}

.shop-preview-product{
    border:1px solid #dde6ee;
    border-radius:16px;
    background:#fbfdff;
    padding:14px;
}

.shop-preview-product-image{
    height:120px;
    border-radius:12px;
    background:linear-gradient(135deg, color-mix(in srgb, var(--preview-primary, #223f5f) 18%, white 82%), color-mix(in srgb, var(--preview-accent, #4cc28a) 26%, white 74%));
    margin-bottom:12px;
}

.shop-preview-product h5{
    margin:0 0 6px;
    color:#223f5f;
    font-size:1rem;
}

.shop-preview-product p{
    margin:0 0 10px;
    color:#6b7a8a;
    line-height:1.55;
    font-size:.92rem;
}

.shop-preview-product strong{
    color:#223f5f;
}

.shop-preview-about{
    border:1px solid #dde6ee;
    border-radius:16px;
    background:#fbfdff;
    padding:16px;
}

.shop-preview-about p{
    margin:0;
    color:#506174;
    line-height:1.65;
}

.shop-preview-shell.layout-minimal .shop-preview-products{
    grid-template-columns:repeat(2, minmax(0, 1fr));
}

.shop-preview-shell.layout-grid .shop-preview-product{
    padding:12px;
}

.shop-preview-shell.layout-grid .shop-preview-product-image{
    height:100px;
}

@media (max-width: 1180px){
    .shop-builder-layout{
        grid-template-columns:320px minmax(0, 1fr);
    }
}

@media (max-width: 980px){
    .shop-builder-topbar{
        flex-direction:column;
    }

    .shop-builder-layout{
        grid-template-columns:1fr;
    }

    .shop-builder-sidebar{
        position:static;
    }

    .shop-preview-hero{
        grid-template-columns:1fr;
    }
}

@media (max-width: 760px){
    .shop-builder-field-row{
        grid-template-columns:1fr;
    }

    .shop-preview-products{
        grid-template-columns:1fr;
    }

    .shop-preview-shell.layout-minimal .shop-preview-products{
        grid-template-columns:1fr;
    }
}

@media (max-width: 640px){
    .shop-builder-wrap{
        margin:18px auto 30px;
        padding:0 12px;
    }

    .shop-builder-topbar,
    .shop-builder-preview-area,
    .shop-builder-section,
    .shop-builder-actions{
        border-radius:18px;
    }

    .shop-builder-topbar-actions,
    .shop-builder-actions{
        flex-direction:column;
    }

    .shop-builder-topbar-actions .btn,
    .shop-builder-actions .btn{
        width:100%;
    }

    .shop-builder-preview-head,
    .shop-preview-topbar,
    .shop-preview-section-head{
        flex-direction:column;
        align-items:flex-start;
    }
}

.shop-preview-section.is-selected{
    outline:2px solid #4cc28a;
    outline-offset:-2px;
    box-shadow:inset 0 0 0 1px rgba(76,194,138,0.18);
}

/* ==========================================================================
   SHOP BUILDER - SECTION EDITOR
   ========================================================================== */

.shop-builder-editor-empty{
    border:1px dashed #cdd9e4;
    border-radius:14px;
    padding:14px;
    background:#fbfdff;
    color:#6b7a8a;
    line-height:1.6;
}

.shop-builder-editor-panel{
    display:grid;
    gap:12px;
}

.shop-builder-editor-panel[hidden]{
    display:none !important;
}

.shop-preview-section.is-selected,
.shop-preview-hero.is-selected{
    outline:2px solid #4cc28a;
    outline-offset:-2px;
    box-shadow:inset 0 0 0 1px rgba(76,194,138,0.18);
}

.shop-preview-products.preview-cols-2{
    grid-template-columns:repeat(2, minmax(0, 1fr));
}

.shop-preview-products.preview-cols-3{
    grid-template-columns:repeat(3, minmax(0, 1fr));
}

.shop-preview-products.preview-cols-4{
    grid-template-columns:repeat(4, minmax(0, 1fr));
}

@media (max-width: 900px){
    .shop-preview-products.preview-cols-4,
    .shop-preview-products.preview-cols-3,
    .shop-preview-products.preview-cols-2{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px){
    .shop-preview-products.preview-cols-4,
    .shop-preview-products.preview-cols-3,
    .shop-preview-products.preview-cols-2{
        grid-template-columns:1fr;
    }
}

/* ==========================================================================
   SHOP BUILDER APP LAYOUT / ACCORDIONS
   ========================================================================== */

.shop-builder-layout{
    display:grid;
    grid-template-columns:360px minmax(0, 1fr);
    gap:20px;
    align-items:start;
    min-height:calc(100vh - 220px);
}

.shop-builder-sidebar{
    position:sticky;
    top:90px;
    height:calc(100vh - 120px);
    min-height:620px;
}

.shop-builder-sidebar-inner{
    height:100%;
    overflow-y:auto;
    overflow-x:visible;
    padding-right:6px;
    display:flex;
    flex-direction:column;
    gap:16px;
}

.shop-builder-sidebar-inner::-webkit-scrollbar,
.shop-builder-preview-area::-webkit-scrollbar{
    width:10px;
}

.shop-builder-sidebar-inner::-webkit-scrollbar-thumb,
.shop-builder-preview-area::-webkit-scrollbar-thumb{
    background:#d6e2ec;
    border-radius:999px;
}

.shop-builder-sidebar-inner::-webkit-scrollbar-track,
.shop-builder-preview-area::-webkit-scrollbar-track{
    background:transparent;
}

.shop-builder-preview-area{
    background:#fff;
    border:1px solid #dde6ee;
    border-radius:20px;
    box-shadow:0 14px 30px rgba(0,0,0,0.07);
    padding:18px;
    min-width:0;
    height:calc(100vh - 120px);
    min-height:620px;
    overflow:auto;
}

.shop-builder-accordion{
    background:#fff;
    border:1px solid #dde6ee;
    border-radius:18px;
    box-shadow:0 14px 30px rgba(0,0,0,0.07);
    overflow:hidden;
    flex:0 0 auto;
    min-height:78px;
}

.shop-builder-accordion-toggle{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:14px 18px;
    background:#fff;
    border:0;
    cursor:pointer;
    text-align:left;
    min-height:56px;
}

.shop-builder-accordion-title{
    display:block;
    min-width:0;
    flex:1 1 auto;
    color:#223f5f;
    font-size:1rem;
    font-weight:800;
    line-height:1.25;
}

.shop-builder-accordion-icon{
    flex:0 0 auto;
    width:28px;
    height:28px;
    min-width:28px;
    min-height:28px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#eef4fa;
    color:#223f5f;
    font-weight:900;
    font-size:1rem;
    transition:transform .18s ease;
}

.shop-builder-accordion.is-open .shop-builder-accordion-icon{
    transform:rotate(45deg);
}

.shop-builder-accordion-panel{
    display:none;
    border-top:1px solid #edf2f7;
    background:#fff;
}

.shop-builder-accordion.is-open .shop-builder-accordion-panel{
    display:block;
}

.shop-builder-section-body{
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:18px;
}

.shop-builder-section-body > *{
    flex:0 0 auto;
}

.shop-builder-section-body label{
    display:block;
    margin:0;
    font-weight:700;
    color:#223f5f;
    line-height:1.35;
}

.shop-builder-section-body input[type="text"],
.shop-builder-section-body textarea,
.shop-builder-section-body select{
    width:100%;
    padding:12px 13px;
    border:1px solid #d9e4ed;
    border-radius:12px;
    background:#fff;
    color:#243243;
    font:inherit;
    margin:0;
}

.shop-builder-section-body textarea{
    resize:vertical;
    min-height:120px;
}

.shop-builder-field-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.shop-builder-field-row > div{
    display:flex;
    flex-direction:column;
    gap:6px;
    min-width:0;
}

.shop-builder-color{
    width:100%;
    min-height:48px;
    padding:6px;
    border:1px solid #d9e4ed;
    border-radius:12px;
    background:#fff;
}

.shop-builder-layout-cards{
    display:grid;
    gap:10px;
}

.shop-layout-card{
    padding:12px 14px;
    border:1px solid #dde6ee;
    border-radius:14px;
    background:#f9fbfd;
}

.shop-layout-card strong{
    display:block;
    color:#223f5f;
    margin-bottom:4px;
}

.shop-layout-card span{
    display:block;
    color:#6b7a8a;
    font-size:.92rem;
    line-height:1.5;
}

.shop-layout-card.active{
    border-color:#4cc28a;
    box-shadow:0 0 0 2px rgba(76,194,138,0.14) inset;
}

.shop-builder-toggle{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:12px;
    border:1px solid #dde6ee;
    border-radius:14px;
    background:#fbfdff;
    margin:0;
}

.shop-builder-toggle input{
    margin-top:3px;
    flex:0 0 auto;
}

.shop-builder-toggle span{
    display:block;
    min-width:0;
}

.shop-builder-toggle strong{
    display:block;
    color:#223f5f;
    margin-bottom:4px;
    line-height:1.3;
}

.shop-builder-toggle small{
    display:block;
    color:#6b7a8a;
    line-height:1.5;
}

.shop-builder-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    padding:16px 18px;
    background:#fff;
    border:1px solid #dde6ee;
    border-radius:18px;
    box-shadow:0 14px 30px rgba(0,0,0,0.07);
    margin-top:0;
    flex:0 0 auto;
}

.shop-builder-editor-empty{
    border:1px dashed #cdd9e4;
    border-radius:14px;
    padding:14px;
    background:#fbfdff;
    color:#6b7a8a;
    line-height:1.6;
}

.shop-builder-editor-panel{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.shop-builder-editor-panel[hidden]{
    display:none !important;
}

.shop-preview-section.is-selected,
.shop-preview-hero.is-selected{
    outline:2px solid #4cc28a;
    outline-offset:-2px;
    box-shadow:inset 0 0 0 1px rgba(76,194,138,0.18);
}

.shop-preview-products.preview-cols-2{
    grid-template-columns:repeat(2, minmax(0, 1fr));
}

.shop-preview-products.preview-cols-3{
    grid-template-columns:repeat(3, minmax(0, 1fr));
}

.shop-preview-products.preview-cols-4{
    grid-template-columns:repeat(4, minmax(0, 1fr));
}

.shop-builder-help{
    display:block;
    margin-top:-6px;
    color:#6b7a8a;
    font-size:.9rem;
    line-height:1.45;
}

.shop-builder-section-body input[type="file"]{
    width:100%;
    padding:10px 12px;
    border:1px solid #d9e4ed;
    border-radius:12px;
    background:#fff;
    color:#243243;
    font:inherit;
}

.shop-builder-image-tools{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.shop-builder-image-tools input[type="file"]{
    width:100%;
    padding:10px 12px;
    border:1px solid #d9e4ed;
    border-radius:12px;
    background:#fff;
    font:inherit;
}

.shop-builder-image-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

/* ==========================================================================
   SHOPFRONT PRODUCT MODAL
   Source: /public/shop/shop.php
   ========================================================================== */

.product-card-modal-trigger{
    cursor:pointer;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.product-card-modal-trigger:hover{
    transform:translateY(-3px);
    box-shadow:0 18px 34px rgba(0,0,0,0.09);
    border-color:color-mix(in srgb, var(--accent) 35%, #dde6ee 65%);
}

.product-card-modal-trigger:focus{
    outline:2px solid var(--accent);
    outline-offset:2px;
}

.shop-product-modal-open{
    overflow:hidden;
}

.shop-product-modal{
    position:fixed;
    inset:0;
    z-index:9999;
}

.shop-product-modal-backdrop{
    position:absolute;
    inset:0;
    background:rgba(16,24,40,.62);
    backdrop-filter:blur(4px);
}

.shop-product-modal-dialog{
    --shop-modal-bg:#ffffff;
    --shop-modal-text:#223f5f;
    --shop-modal-accent:#4cc28a;
    --shop-modal-font:Arial, Helvetica, sans-serif;

    position:relative;
    z-index:1;
    width:min(1180px, calc(100% - 32px));
    max-height:calc(100vh - 32px);
    margin:16px auto;
    background:var(--shop-modal-bg);
    color:var(--shop-modal-text);
    border:1px solid color-mix(in srgb, var(--shop-modal-accent) 26%, #dbe4ee 74%);
    border-radius:24px;
    box-shadow:0 24px 60px rgba(0,0,0,.22);
    overflow:hidden;
    font-family:var(--shop-modal-font);
}

.shop-product-modal-close{
    position:absolute;
    top:14px;
    right:14px;
    width:42px;
    height:42px;
    border:1px solid color-mix(in srgb, var(--shop-modal-accent) 30%, #dbe4ee 70%);
    background:rgba(255,255,255,.92);
    color:var(--shop-modal-text);
    border-radius:999px;
    font-size:26px;
    line-height:1;
    cursor:pointer;
    z-index:3;
    box-shadow:0 8px 22px rgba(0,0,0,.10);
}

.shop-product-modal-grid{
    display:grid;
    grid-template-columns:minmax(0, 1.05fr) minmax(320px, .95fr);
    min-height:min(760px, calc(100vh - 32px));
}

.shop-product-modal-media{
    padding:22px;
    border-right:1px solid color-mix(in srgb, var(--shop-modal-accent) 16%, #dde6ee 84%);
    background:linear-gradient(
        180deg,
        color-mix(in srgb, var(--shop-modal-accent) 8%, white 92%) 0%,
        color-mix(in srgb, var(--shop-modal-bg) 90%, white 10%) 100%
    );
    display:flex;
    flex-direction:column;
    gap:14px;
    min-width:0;
}

.shop-product-modal-main{
    flex:1 1 auto;
    min-height:420px;
    border:1px solid color-mix(in srgb, var(--shop-modal-accent) 18%, #dde6ee 82%);
    border-radius:20px;
    background:#f8fbff;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
}

.shop-product-modal-main img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
    background:#fff;
}

.shop-product-modal-main-placeholder{
    width:100%;
    min-height:420px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:20px;
    color:#6b7a8a;
    font-weight:800;
    background:linear-gradient(135deg, #eef4fa, #f8fbfd);
}

.shop-product-modal-thumbs{
    display:flex;
    gap:10px;
    overflow-x:auto;
    padding-bottom:4px;
}

.shop-product-modal-thumb{
    width:88px;
    height:88px;
    min-width:88px;
    border-radius:14px;
    overflow:hidden;
    border:2px solid transparent;
    background:#fff;
    cursor:pointer;
    padding:0;
    flex:0 0 auto;
}

.shop-product-modal-thumb.is-active{
    border-color:var(--shop-modal-accent);
    box-shadow:0 0 0 3px color-mix(in srgb, var(--shop-modal-accent) 20%, transparent 80%);
}

.shop-product-modal-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.shop-product-modal-details{
    padding:28px 24px;
    overflow:auto;
    min-width:0;
}

.shop-product-modal-head{
    margin-bottom:20px;
}

.shop-product-modal-tag{
    display:inline-flex;
    align-items:center;
    min-height:32px;
    padding:0 12px;
    border-radius:999px;
    background:color-mix(in srgb, var(--shop-modal-accent) 14%, white 86%);
    color:var(--shop-modal-text);
    font-size:.82rem;
    font-weight:800;
    margin-bottom:14px;
}

.shop-product-modal-head h2{
    margin:0 0 10px;
    font-size:clamp(1.9rem, 3vw, 2.6rem);
    line-height:1.1;
    color:var(--shop-modal-text);
}

.shop-product-modal-price{
    font-size:1.5rem;
    font-weight:900;
    color:var(--shop-modal-accent);
}

.shop-product-modal-short{
    padding:16px 18px;
    border:1px solid color-mix(in srgb, var(--shop-modal-accent) 16%, #dde6ee 84%);
    border-radius:18px;
    background:color-mix(in srgb, var(--shop-modal-accent) 6%, white 94%);
    line-height:1.65;
    color:var(--shop-modal-text);
    margin-bottom:18px;
}

.shop-product-modal-description-wrap{
    border:1px solid color-mix(in srgb, var(--shop-modal-accent) 16%, #dde6ee 84%);
    border-radius:18px;
    background:#fff;
    padding:18px;
}

.shop-product-modal-subheading{
    margin:0 0 12px;
    font-size:1rem;
    color:var(--shop-modal-accent);
}

.shop-product-modal-description{
    white-space:pre-line;
    line-height:1.75;
    color:var(--shop-modal-text);
}

@media (max-width: 920px){
    .shop-product-modal-dialog{
        width:min(100%, calc(100% - 20px));
        max-height:calc(100vh - 20px);
        margin:10px auto;
    }

    .shop-product-modal-grid{
        grid-template-columns:1fr;
        min-height:auto;
    }

    .shop-product-modal-media{
        border-right:0;
        border-bottom:1px solid color-mix(in srgb, var(--shop-modal-accent) 16%, #dde6ee 84%);
    }

    .shop-product-modal-main,
    .shop-product-modal-main-placeholder{
        min-height:300px;
    }
}

@media (max-width: 640px){
    .shop-product-modal-media,
    .shop-product-modal-details{
        padding:16px;
    }

    .shop-product-modal-main,
    .shop-product-modal-main-placeholder{
        min-height:240px;
    }

    .shop-product-modal-thumb{
        width:72px;
        height:72px;
        min-width:72px;
    }

    .shop-product-modal-close{
        top:10px;
        right:10px;
        width:38px;
        height:38px;
    }
}

@media (max-width: 1180px){
    .shop-builder-layout{
        grid-template-columns:320px minmax(0, 1fr);
    }
}

@media (max-width: 980px){
    .shop-builder-layout{
        grid-template-columns:1fr;
        min-height:auto;
    }

    .shop-builder-sidebar,
    .shop-builder-preview-area{
        position:static;
        height:auto;
        min-height:unset;
    }

    .shop-builder-sidebar-inner,
    .shop-builder-preview-area{
        overflow:visible;
    }
}

@media (max-width: 900px){
    .shop-preview-products.preview-cols-4,
    .shop-preview-products.preview-cols-3,
    .shop-preview-products.preview-cols-2{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px){
    .shop-builder-field-row{
        grid-template-columns:1fr;
    }

    .shop-preview-products.preview-cols-4,
    .shop-preview-products.preview-cols-3,
    .shop-preview-products.preview-cols-2{
        grid-template-columns:1fr;
    }
}

/* ==========================================================================
   SECTIONS MANAGER + SECTION STYLE OVERRIDES
   ========================================================================== */

.section-editor-status{
    font-weight:700;
    color:#223f5f;
    margin-bottom:4px;
}

.sections-manager{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.section-manager-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 12px;
    border:1px solid #dde6ee;
    border-radius:14px;
    background:#fbfdff;
}

.section-manager-item.is-active{
    border-color:#4cc28a;
    box-shadow:0 0 0 2px rgba(76,194,138,.14) inset;
}

.section-manager-item.is-hidden{
    opacity:.55;
}

.section-manager-main{
    min-width:0;
    flex:1 1 auto;
}

.section-manager-select{
    background:none;
    border:0;
    padding:0;
    margin:0;
    font:inherit;
    font-weight:800;
    color:#223f5f;
    cursor:pointer;
    text-align:left;
}

.section-manager-actions{
    display:flex;
    gap:6px;
    flex:0 0 auto;
}

.section-manager-btn{
    width:32px;
    height:32px;
    border-radius:10px;
    border:1px solid #dbe4ee;
    background:#fff;
    cursor:pointer;
    font-weight:800;
}

.section-manager-btn:hover{
    background:#eef4fa;
}

.preview-sections-container{
    display:flex;
    flex-direction:column;
}

.preview-section-wrap{
    display:block;
}

.shop-preview-hero{
    transition:all .18s ease;
}

.shop-preview-section{
    transition:all .18s ease;
    border-top:2px solid transparent;
}

.shop-preview-product{
    transition:background-color .18s ease, color .18s ease, border-color .18s ease;
}

.product-card-modal-trigger{
    cursor:pointer;
}

.product-card-modal-trigger img,
.product-card-modal-trigger .product-body,
.product-card-modal-trigger .product-title,
.product-card-modal-trigger .product-desc,
.product-card-modal-trigger .product-meta,
.product-card-modal-trigger .price,
.product-card-modal-trigger .tag{
    pointer-events:none;
}

/* ==========================================================================
   SHOP BUILDER - STORY / IMAGE SECTION
   ========================================================================== */

.shop-preview-story-section{
    border-top:2px solid transparent;
}

.shop-preview-story-grid{
    display:grid;
    grid-template-columns:minmax(260px, .95fr) minmax(0, 1.05fr);
    gap:18px;
    align-items:center;
}

.shop-preview-story-section.image-right .shop-preview-story-grid{
    grid-template-columns:minmax(0, 1.05fr) minmax(260px, .95fr);
}

.shop-preview-story-section.image-right .shop-preview-story-media{
    order:2;
}

.shop-preview-story-section.image-right .shop-preview-story-copy{
    order:1;
}

.shop-preview-story-media{
    min-width:0;
}

.shop-preview-story-image-card{
    width:100%;
    min-height:260px;
    border:1px solid #dde6ee;
    background:#f8fbff;
    overflow:hidden;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
}

.shop-preview-story-image-card.has-image{
    background:#ffffff;
}

.shop-preview-story-image-card img{
    width:100%;
    height:100%;
    min-height:260px;
    object-fit:cover;
    display:block;
}

.shop-preview-story-placeholder{
    width:100%;
    min-height:260px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px;
    text-align:center;
    color:#6b7a8a;
    font-weight:800;
    letter-spacing:.02em;
    background:
        linear-gradient(135deg,
            color-mix(in srgb, var(--preview-primary, #223f5f) 10%, white 90%),
            color-mix(in srgb, var(--preview-accent, #4cc28a) 16%, white 84%)
        );
}

.shop-preview-story-copy{
    min-width:0;
}

.shop-preview-story-copy .shop-preview-section-head{
    margin-bottom:14px;
}

.shop-preview-story-copy .shop-preview-about{
    background:#fbfdff;
}

.shop-preview-story-copy .shop-preview-about p{
    margin:0;
    line-height:1.7;
}

.shop-preview-story-copy .shop-preview-hero-actions{
    margin-top:16px;
}

.shop-preview-story-copy .shop-preview-btn{
    text-decoration:none;
}

.shop-preview-product{
    overflow:hidden;
}

.shop-preview-product img{
    display:block;
    width:100%;
    height:120px;
    object-fit:cover;
    border-radius:12px;
}

@media (max-width: 980px){
    .shop-preview-story-grid,
    .shop-preview-story-section.image-right .shop-preview-story-grid{
        grid-template-columns:1fr;
    }

    .shop-preview-story-section.image-right .shop-preview-story-media,
    .shop-preview-story-section.image-right .shop-preview-story-copy{
        order:initial;
    }
}

@media (max-width: 640px){
    .shop-preview-story-image-card,
    .shop-preview-story-image-card img,
    .shop-preview-story-placeholder{
        min-height:210px;
    }
}

/* ==========================================================================
   SECTION LIBRARY / GROUPED SIDEBAR POLISH
   ========================================================================== */

.sections-manager{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.sections-manager-toolbar{
    margin-bottom:2px;
}

.section-library-open-btn{
    width:100%;
    min-height:40px;
    border-radius:12px;
}

.section-library-group{
    border:1px solid #dde6ee;
    border-radius:14px;
    background:#ffffff;
    overflow:hidden;
    box-shadow:0 4px 12px rgba(0,0,0,0.03);
}

.section-library-group + .section-library-group{
    margin-top:0;
}

.section-library-group-toggle{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:12px 14px;
    background:linear-gradient(180deg, #f8fbff 0%, #f2f7fc 100%);
    border:0;
    cursor:pointer;
    text-align:left;
    font:inherit;
    font-weight:800;
    color:#223f5f;
    letter-spacing:.01em;
}

.section-library-group-toggle:hover{
    background:linear-gradient(180deg, #f3f8fd 0%, #edf4fb 100%);
}

.section-library-group-icon{
    width:26px;
    height:26px;
    min-width:26px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#e9f1f8;
    color:#223f5f;
    font-weight:900;
    transition:transform .18s ease;
}

.section-library-group.is-open .section-library-group-icon{
    transform:rotate(45deg);
}

.section-library-group-panel{
    display:none;
    padding:12px;
    border-top:1px solid #edf2f7;
    background:#ffffff;
}

.section-library-group-panel.is-open{
    display:block;
}

.section-library-group-panel .section-manager-item{
    margin-bottom:10px;
}

.section-library-group-panel .section-manager-item:last-child{
    margin-bottom:0;
}

.section-manager-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 12px;
    border:1px solid #dde6ee;
    border-radius:14px;
    background:#fbfdff;
}

.section-manager-select{
    background:none;
    border:0;
    padding:0;
    margin:0;
    font:inherit;
    font-weight:800;
    color:#223f5f;
    cursor:pointer;
    text-align:left;
}

.is-library-item{
    opacity:1;
}

.is-library-item .section-manager-select{
    font-weight:700;
    color:#506174;
}

/* ==========================================================================  
   SHOP PRODUCT MODAL
   Source: /public/shop/shop.php
   ========================================================================== */

.product-card-modal-trigger{
    cursor:pointer;
    transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.product-card-modal-trigger:hover{
    transform:translateY(-3px);
    box-shadow:0 18px 34px rgba(0,0,0,0.10);
    border-color:var(--accent);
}

.product-card-modal-trigger:focus{
    outline:2px solid var(--accent);
    outline-offset:2px;
}

.product-card-modal-trigger .product-title{
    transition:color .16s ease;
}

.product-card-modal-trigger:hover .product-title{
    color:var(--accent);
}

.shop-product-modal-open{
    overflow:hidden;
}

.shop-product-modal{
    position:fixed;
    inset:0;
    z-index:9999;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
}

.shop-product-modal[hidden]{
    display:none !important;
}

.shop-product-modal-backdrop{
    position:absolute;
    inset:0;
    background:rgba(15, 23, 42, 0.68);
    backdrop-filter:blur(4px);
}

.shop-product-modal-dialog{
    --shop-modal-bg:#ffffff;
    --shop-modal-text:#223f5f;
    --shop-modal-accent:#4cc28a;
    --shop-modal-font:Arial, Helvetica, sans-serif;

    position:relative;
    z-index:1;
    width:min(1100px, 100%);
    max-height:calc(100vh - 48px);
    overflow:auto;
    border-radius:22px;
    border:1px solid rgba(255,255,255,0.16);
    background:var(--shop-modal-bg);
    color:var(--shop-modal-text);
    box-shadow:0 30px 80px rgba(0,0,0,0.28);
    font-family:var(--shop-modal-font);
}

.shop-product-modal-close{
    position:absolute;
    top:16px;
    right:16px;
    width:42px;
    height:42px;
    border:0;
    border-radius:999px;
    background:#eef4fa;
    color:var(--shop-modal-text);
    font-size:28px;
    line-height:1;
    cursor:pointer;
    z-index:2;
}

.shop-product-modal-close:hover{
    background:#dde8f2;
}

.shop-product-modal-grid{
    display:grid;
    grid-template-columns:minmax(0, 1.05fr) minmax(320px, .95fr);
    gap:0;
    min-height:560px;
}

.shop-product-modal-media{
    padding:24px;
    border-right:1px solid var(--line);
    background:linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
}

.shop-product-modal-main{
    width:100%;
    height:420px;
    border:1px solid var(--line);
    border-radius:18px;
    overflow:hidden;
    background:#f4f8fc;
    display:flex;
    align-items:center;
    justify-content:center;
}

.shop-product-modal-main img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.shop-product-modal-main-placeholder{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--muted);
    font-weight:800;
    padding:20px;
    text-align:center;
}

.shop-product-modal-thumbs{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    margin-top:14px;
}

.shop-product-modal-thumb{
    width:84px;
    height:84px;
    padding:0;
    border:1px solid var(--line);
    border-radius:14px;
    overflow:hidden;
    background:#fff;
    cursor:pointer;
    flex:0 0 auto;
}

.shop-product-modal-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.shop-product-modal-thumb.is-active{
    border-color:var(--shop-modal-accent);
    box-shadow:0 0 0 2px color-mix(in srgb, var(--shop-modal-accent) 24%, white 76%);
}

.shop-product-modal-details{
    padding:28px 24px 24px;
    display:flex;
    flex-direction:column;
    gap:18px;
}

.shop-product-modal-head{
    padding-right:50px;
}

.shop-product-modal-tag{
    display:inline-flex;
    align-items:center;
    min-height:32px;
    padding:0 12px;
    border-radius:999px;
    background:#eef4fa;
    color:var(--shop-modal-text);
    font-size:.84rem;
    font-weight:800;
    margin-bottom:14px;
}

.shop-product-modal-head h2{
    margin:0 0 10px;
    color:var(--shop-modal-text);
    font-size:clamp(1.6rem, 2.4vw, 2.2rem);
    line-height:1.15;
}

.shop-product-modal-price{
    color:var(--shop-modal-accent);
    font-weight:900;
    font-size:1.5rem;
}

.shop-product-modal-short{
    color:var(--muted);
    line-height:1.65;
    font-size:1rem;
}

.shop-product-modal-description-wrap{
    border-top:1px solid var(--line);
    padding-top:18px;
}

.shop-product-modal-subheading{
    margin:0 0 10px;
    color:var(--shop-modal-text);
    font-size:1rem;
}

.shop-product-modal-description{
    color:var(--shop-modal-text);
    line-height:1.75;
    white-space:pre-line;
}

@media (max-width: 900px){
    .shop-product-modal{
        padding:16px;
        align-items:flex-start;
    }

    .shop-product-modal-dialog{
        max-height:calc(100vh - 32px);
    }

    .shop-product-modal-grid{
        grid-template-columns:1fr;
    }

    .shop-product-modal-media{
        border-right:0;
        border-bottom:1px solid var(--line);
    }

    .shop-product-modal-main{
        height:300px;
    }
}

@media (max-width: 640px){
    .shop-product-modal{
        padding:10px;
    }

    .shop-product-modal-dialog{
        border-radius:18px;
        max-height:calc(100vh - 20px);
    }

    .shop-product-modal-media,
    .shop-product-modal-details{
        padding:16px;
    }

    .shop-product-modal-main{
        height:240px;
    }

    .shop-product-modal-thumb{
        width:68px;
        height:68px;
    }
}

.purchases-page .item {
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 14px;
  align-items: start;
}

.purchases-page .item-actions {
  grid-column: 2 / 4;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding-top: 8px;
}

.purchases-page .item-actions form {
  display: flex !important;
  gap: 8px;
  flex-wrap: wrap;
}

.purchases-page .item-actions .btn {
  min-height: 36px;
  padding: 0 12px;
}

/* ==========================================================================
   RESPONSIVE
   Source: shared marketplace responsiveness
   ========================================================================== */
@media (max-width: 1120px){
    .marketplace-home .quick-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .marketplace-home .product-grid{
        grid-template-columns:repeat(3,1fr);
    }

    .marketplace-home .shop-grid{
        grid-template-columns:repeat(2,1fr);
    }
}

@media (max-width: 980px){
    .shop-grid{
        grid-template-columns:repeat(2, 1fr);
    }

    .products-classic,
    .products-grid{
        grid-template-columns:repeat(2, 1fr);
    }
}

@media (max-width: 900px){
    .order-page .grid{
        grid-template-columns:1fr;
    }

    .marketplace-home .hero{
        grid-template-columns:1fr;
    }
}

@media (max-width: 860px){
    .product-page .layout{
        grid-template-columns:1fr;
    }

    .product-page .main-image{
        height:300px;
    }
}

@media (max-width: 820px){
    .top-inner{
        flex-direction:column;
        align-items:stretch;
        padding:10px 0;
    }

    .brand{
        justify-content:center;
    }

    .nav{
        overflow-x:auto;
        flex-wrap:nowrap;
        padding-bottom:6px;
        scrollbar-width:none;
    }

    .nav::-webkit-scrollbar{
        display:none;
    }

    .nav a{
        flex:0 0 auto;
    }
}

@media (max-width: 760px){
    .marketplace-home .section-head,
    .marketplace-home .footer-inner{
        flex-direction:column;
        align-items:flex-start;
    }

    .marketplace-home .quick-grid,
    .marketplace-home .product-grid,
    .marketplace-home .shop-grid,
    .marketplace-home .mini-stats{
        grid-template-columns:1fr;
    }

    .marketplace-home .seller-cta{
        align-items:flex-start;
    }
}

@media (max-width: 720px){
    .products-classic,
    .products-minimal,
    .products-grid{
        grid-template-columns:1fr;
    }

    .shopfront-page .section-head,
    .footer-inner{
        flex-direction:column;
        align-items:flex-start;
    }

    .purchases-page .item{
        grid-template-columns:60px 1fr;
    }

    .item-total{
        grid-column:2;
    }
}

@media (max-width: 700px){
    .shop-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width: 480px){
    .nav a{
        font-size:.8rem;
        padding:7px 10px;
    }

    .brand span{
        font-size:.95rem;
    }
}

@media (max-width: 900px){
    .checkout-page .checkout-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width: 640px){
    .checkout-page .form-grid{
        grid-template-columns:1fr;
    }

    .checkout-page .item{
        grid-template-columns:60px 1fr;
    }

    .checkout-page .item-total{
        grid-column:2;
    }

    .checkout-page .thumb{
        width:60px;
        height:60px;
    }
}

@media (max-width: 920px){
    .cart-page .grid{
        grid-template-columns:1fr;
    }
}

@media (max-width: 700px){
    .cart-page .item{
        grid-template-columns:72px 1fr;
    }

    .cart-page .thumb{
        width:72px;
        height:72px;
    }

    .cart-page .item-total{
        grid-column:2;
        text-align:left;
    }
}

@media (max-width: 760px){
    .seller-landing-page .grid{
        grid-template-columns:1fr;
    }
}

/* ==========================================================================
   SHOP MOBILE HEADER MENU
   Source: /public/shop/partials/header.php
   ========================================================================== */

.shop-menu-toggle {
    display: none;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--brand);
    font-size: 22px;
    font-weight: 900;
    cursor: pointer;
}

.shop-mobile-menu {
    display: none;
}

@media (max-width: 820px) {
    .top-inner {
        min-height: 64px;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 8px 0 !important;
    }

    .topbar .brand {
        justify-content: flex-start !important;
        min-width: 0;
    }

    .topbar .brand span {
        font-size: .95rem;
        white-space: nowrap;
    }

    .topbar .nav {
        display: none !important;
    }

    .shop-menu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
    }

    .shop-mobile-menu.open {
        display: grid;
        gap: 8px;
        padding: 12px;
        border-top: 1px solid var(--line);
        background: #fff;
        box-shadow: 0 18px 32px rgba(0,0,0,.08);
    }

    .shop-mobile-menu a {
        display: flex;
        align-items: center;
        min-height: 42px;
        padding: 0 14px;
        border-radius: 12px;
        background: #f6f8fb;
        color: var(--brand);
        font-weight: 800;
    }

    .shop-mobile-menu a.community {
        background: var(--brand);
        color: #fff;
    }
}

@media (max-width: 430px) {
    .topbar .brand span {
        display: none;
    }

    .topbar .brand img {
        width: 38px;
        height: 38px;
    }
}

/* ==========================================================================
   SHOP BUILDER MOBILE STACK FIX
   ========================================================================== */

@media (max-width: 980px) {
    .shop-builder-layout {
        display: flex !important;
        flex-direction: column !important;
        gap: 18px !important;
    }

    .shop-builder-sidebar,
    .shop-builder-preview-area {
        width: 100% !important;
        position: static !important;
        top: auto !important;
        height: auto !important;
        min-height: unset !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .shop-builder-preview-area {
        margin-top: 18px !important;
        z-index: 1 !important;
    }

    .shop-builder-sidebar {
        z-index: 2 !important;
    }

    .shop-builder-sidebar-inner {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

.shop-mobile-menu a,
.shop-mobile-menu a:visited,
.shop-mobile-menu a:hover,
.shop-mobile-menu a:active {
    color: var(--brand) !important;
    text-decoration: none !important;
}

.shop-mobile-menu a.community,
.shop-mobile-menu a.community:visited,
.shop-mobile-menu a.community:hover,
.shop-mobile-menu a.community:active {
    color: #fff !important;
    text-decoration: none !important;
}

/* Force shared shop header to work inside seller dashboard pages */
.seller-dashboard-page .topbar .shop-menu-toggle {
    display: none;
}

@media (max-width: 820px) {
    .seller-dashboard-page .topbar .nav {
        display: none !important;
    }

    .seller-dashboard-page .topbar .shop-menu-toggle {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .seller-dashboard-page .topbar .shop-mobile-menu {
        display: none !important;
    }

    .seller-dashboard-page .topbar .shop-mobile-menu.open {
        display: grid !important;
    }
}

/* Keep shared shop header consistent on seller dashboard */
.seller-dashboard-page .topbar {
    background: transparent !important;
    border-bottom: 0 !important;
    padding: 0 !important;
}

.seller-dashboard-page .top-inner {
    width: min(1240px, calc(100% - 32px)) !important;
    margin: 0 auto !important;
    min-height: 58px !important;
    padding: 0 18px !important;
    border-radius: 18px !important;
    background: #fff !important;
    border: 1px solid var(--line) !important;
    box-shadow: var(--shadow) !important;
}

@media (max-width: 820px) {
    .seller-dashboard-page .topbar {
        padding: 10px 0 !important;
    }

    .seller-dashboard-page .top-inner {
        width: min(1240px, calc(100% - 24px)) !important;
        border-radius: 18px !important;
    }
}

.shop-header-actions{
    display:flex;
    align-items:center;
    gap:10px;
}

.shop-notification-wrap{
    position:relative;
}

.shop-notification-btn{
    position:relative;
    width:42px;
    height:42px;
    border-radius:999px;
    border:1px solid var(--line);
    background:#fff;
    color:var(--brand);
    cursor:pointer;
    font-size:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 8px 18px rgba(34,63,95,.06);
}

.shop-notification-btn:hover{
    background:#eef4fa;
}

.shop-notification-count{
    position:absolute;
    top:-5px;
    right:-5px;
    min-width:20px;
    height:20px;
    padding:0 6px;
    border-radius:999px;
    background:#ef4444;
    color:#fff;
    font-size:11px;
    font-weight:900;
    display:flex;
    align-items:center;
    justify-content:center;
    border:2px solid #fff;
}

.shop-notification-dropdown{
    display:none;
    position:absolute;
    top:50px;
    right:0;
    width:340px;
    max-width:calc(100vw - 24px);
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:0 22px 48px rgba(15,23,42,.16);
    overflow:hidden;
    z-index:999;
}

.shop-notification-dropdown.open{
    display:block;
}

.shop-notification-head{
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:14px 16px;
    background:linear-gradient(135deg,#223f5f,#355f8e);
    color:#fff;
}

.shop-notification-head span{
    font-size:12px;
    opacity:.85;
}

.shop-notification-empty{
    padding:18px 16px;
    color:var(--muted);
    font-size:14px;
}

.shop-notification-item{
    display:block;
    padding:13px 16px;
    border-bottom:1px solid #eef3f8;
    background:#fff;
}

.shop-notification-item:hover{
    background:#f8fbff;
}

.shop-notification-item.is-unread{
    background:#f1f8ff;
}

.shop-notification-item strong{
    display:block;
    color:var(--brand);
    font-size:14px;
    margin-bottom:4px;
}

.shop-notification-item span{
    display:block;
    color:var(--muted);
    font-size:13px;
    line-height:1.4;
}

@media (max-width: 820px){
    .shop-header-actions{
        margin-left:auto;
    }

    .shop-header-actions .nav{
        display:none !important;
    }

    .shop-notification-dropdown{
        right:-54px;
    }
}

.topbar .shop-notification-btn,
.seller-dashboard-page .topbar .shop-notification-btn{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    min-height:42px !important;
    padding:0 !important;
    border-radius:999px !important;
    border:1px solid var(--line) !important;
    background:#fff !important;
    color:var(--brand) !important;
    font-size:18px !important;
    line-height:1 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-shadow:0 8px 18px rgba(34,63,95,.08) !important;
}

.topbar .shop-notification-head span{
    display:none !important;
}

.topbar .shop-notification-dropdown{
    text-align:left !important;
}

/* ==========================================================================
   BUYER PURCHASES POLISH
   ========================================================================== */

.buyer-orders-wrap{
    width:min(1120px, calc(100% - 32px));
    margin:28px auto 48px;
}

.buyer-orders-hero{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
    padding:26px;
    margin-bottom:20px;
    border-radius:24px;
    background:linear-gradient(135deg,#223f5f,#355f8e);
    color:#fff;
    box-shadow:0 18px 38px rgba(34,63,95,.16);
}

.buyer-orders-eyebrow{
    margin:0 0 8px;
    font-size:12px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:#9ee6bd;
}

.buyer-orders-hero h1{
    margin:0 0 8px;
    font-size:clamp(2rem,4vw,3rem);
}

.buyer-orders-hero p{
    margin:0;
    max-width:720px;
    line-height:1.55;
    color:rgba(255,255,255,.92);
}

.buyer-order-list{
    display:grid;
    gap:18px;
}

.buyer-order-card,
.buyer-order-empty{
    background:#fff;
    border:1px solid var(--line);
    border-radius:22px;
    box-shadow:0 14px 30px rgba(15,23,42,.07);
}

.buyer-order-empty{
    text-align:center;
    padding:44px 20px;
}

.buyer-order-empty h2{
    margin:0 0 8px;
    color:var(--brand);
}

.buyer-order-empty p{
    margin:0 0 18px;
    color:var(--muted);
}

.buyer-order-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;
    padding:20px 22px;
    border-bottom:1px solid #edf2f7;
}

.buyer-order-label{
    display:block;
    margin-bottom:4px;
    color:var(--muted);
    font-size:12px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.buyer-order-head h2{
    margin:0 0 4px;
    color:var(--brand);
    font-size:1.25rem;
}

.buyer-order-head p{
    margin:0;
    color:var(--muted);
    font-size:14px;
}

.buyer-order-head-meta{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    flex-wrap:wrap;
    text-align:right;
}

.buyer-order-head-meta strong{
    color:var(--brand);
    font-size:1.08rem;
    margin-left:6px;
}

.buyer-order-items{
    display:grid;
}

.buyer-order-item{
    display:grid;
    grid-template-columns:78px minmax(0, 1fr);
    gap:16px;
    padding:18px 22px;
    border-bottom:1px solid #edf2f7;
}

.buyer-order-item:last-child{
    border-bottom:0;
}

.buyer-order-thumb{
    width:78px;
    height:78px;
    border-radius:16px;
    border:1px solid var(--line);
    background:#f8fbff center/cover no-repeat;
}

.buyer-order-main{
    min-width:0;
}

.buyer-order-title-row{
    display:flex;
    justify-content:space-between;
    gap:14px;
    align-items:flex-start;
}

.buyer-order-title-row h3{
    margin:0 0 5px;
    color:var(--brand);
    font-size:1rem;
}

.buyer-order-title-row p{
    margin:0;
    color:var(--muted);
    font-size:14px;
}

.buyer-order-price{
    color:var(--brand);
    font-weight:900;
    white-space:nowrap;
}

.buyer-order-status-row{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    margin-top:10px;
}

.buyer-order-ref{
    color:var(--muted);
    font-size:12px;
    font-weight:700;
}

.status-pill{
    display:inline-flex;
    align-items:center;
    min-height:28px;
    padding:0 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:900;
    background:#eef4fa;
    color:#223f5f;
}

.status-pill.is-good{
    background:#eefbf3;
    color:#23663f;
}

.status-pill.is-active{
    background:#eef4ff;
    color:#244f8f;
}

.status-pill.is-warning{
    background:#fff7e6;
    color:#8a5a00;
}

.status-pill.is-danger{
    background:#fff1f1;
    color:#9b2c2c;
}

.status-pill.is-neutral{
    background:#eef4fa;
    color:#223f5f;
}

.buyer-tracking-panel{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
    margin-top:14px;
    padding:14px;
    border:1px solid #dbe7f1;
    border-radius:16px;
    background:linear-gradient(180deg,#f8fbff,#ffffff);
}

.buyer-tracking-panel strong,
.buyer-tracking-panel span{
    display:block;
}

.buyer-tracking-panel strong{
    color:var(--brand);
    margin-bottom:4px;
}

.buyer-tracking-panel span{
    color:var(--muted);
    font-size:13px;
    line-height:1.5;
}

.buyer-order-actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top:14px;
}

.buyer-order-actions .btn{
    min-height:38px;
    border-radius:999px;
    font-size:13px;
}

.buyer-order-foot{
    display:flex;
    justify-content:flex-end;
    padding:16px 22px;
    border-top:1px solid #edf2f7;
    background:#fbfdff;
    border-radius:0 0 22px 22px;
}

@media (max-width: 760px){
    .buyer-orders-hero,
    .buyer-order-head,
    .buyer-order-title-row{
        flex-direction:column;
        align-items:flex-start;
    }

    .buyer-order-head-meta{
        justify-content:flex-start;
        text-align:left;
    }

    .buyer-order-item{
        grid-template-columns:64px minmax(0, 1fr);
        padding:16px;
    }

    .buyer-order-thumb{
        width:64px;
        height:64px;
        border-radius:14px;
    }

    .buyer-tracking-panel{
        align-items:flex-start;
    }

    .buyer-order-actions .btn,
    .buyer-order-foot .btn{
        width:100%;
    }

    .buyer-order-foot{
        justify-content:stretch;
    }
}

@media (max-width: 480px){
    .buyer-orders-wrap{
        width:min(100% - 20px, 1120px);
        margin-top:18px;
    }

    .buyer-orders-hero{
        padding:20px;
        border-radius:20px;
    }
}

/* ==========================================================================
   SELLER ORDERS POLISH
   ========================================================================== */

.seller-orders-page{
    background:#f6f8fb;
}

.seller-orders-wrap{
    width:min(1200px, calc(100% - 32px));
    margin:28px auto 48px;
}

.seller-orders-hero{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
    padding:28px;
    margin-bottom:20px;
    border-radius:24px;
    background:linear-gradient(135deg,#223f5f,#355f8e);
    color:#fff;
    box-shadow:0 18px 38px rgba(34,63,95,.16);
}

.seller-orders-eyebrow{
    margin:0 0 8px;
    font-size:12px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:#9ee6bd;
}

.seller-orders-hero h1{
    margin:0 0 8px;
    font-size:clamp(2rem,4vw,3rem);
}

.seller-orders-hero p{
    margin:0;
    max-width:760px;
    line-height:1.55;
    color:rgba(255,255,255,.92);
}

.seller-orders-hero-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

.seller-orders-notice{
    padding:14px 16px;
    margin-bottom:18px;
    border-radius:16px;
    background:#eefbf3;
    color:#23663f;
    border:1px solid #bfe6cd;
    font-weight:900;
}

.seller-orders-empty{
    text-align:center;
    padding:44px 20px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:22px;
    box-shadow:0 14px 30px rgba(15,23,42,.07);
}

.seller-orders-empty h2{
    margin:0 0 8px;
    color:var(--brand);
}

.seller-orders-empty p{
    margin:0;
    color:var(--muted);
}

.seller-orders-list{
    display:grid;
    gap:18px;
}

.seller-order-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:22px;
    box-shadow:0 14px 30px rgba(15,23,42,.07);
    overflow:hidden;
}

.seller-order-card-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;
    padding:20px 22px;
    border-bottom:1px solid #edf2f7;
    background:#fbfdff;
}

.seller-order-label{
    display:block;
    margin-bottom:4px;
    color:var(--muted);
    font-size:12px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.seller-order-card-head h2{
    margin:0 0 4px;
    color:var(--brand);
    font-size:1.25rem;
}

.seller-order-card-head p{
    margin:0;
    color:var(--muted);
    font-size:14px;
}

.seller-order-statuses{
    display:flex;
    justify-content:flex-end;
    gap:8px;
    flex-wrap:wrap;
}

.seller-order-grid{
    display:grid;
    grid-template-columns:1.1fr .9fr 1fr .8fr 1fr;
    gap:0;
}

.seller-order-panel{
    padding:18px;
    border-right:1px solid #edf2f7;
    border-bottom:1px solid #edf2f7;
    min-width:0;
}

.seller-order-panel:last-child{
    border-right:0;
}

.seller-order-panel h3{
    margin:0 0 12px;
    color:var(--brand);
    font-size:.95rem;
}

.seller-order-panel strong,
.seller-order-panel span,
.seller-order-panel small{
    display:block;
}

.seller-order-panel span,
.seller-order-panel small,
.seller-order-muted{
    color:var(--muted);
    font-size:13px;
    line-height:1.45;
}

.seller-order-product-row{
    display:flex;
    gap:12px;
    align-items:flex-start;
}

.seller-order-thumb{
    width:64px;
    height:64px;
    min-width:64px;
    border-radius:14px;
    border:1px solid var(--line);
    background:#f8fbff center/cover no-repeat;
}

.seller-order-note,
.seller-order-tracking{
    margin-top:12px;
    padding:12px;
    border:1px solid #dbe7f1;
    border-radius:14px;
    background:#f8fbff;
}

.seller-order-note strong,
.seller-order-tracking strong{
    margin-bottom:4px;
    color:var(--brand);
}

.seller-order-tracking a{
    display:inline-flex;
    margin-top:6px;
    color:var(--brand);
    font-weight:900;
}

.seller-order-money div{
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:7px 0;
    border-bottom:1px solid #edf2f7;
}

.seller-order-money div:last-child{
    border-bottom:0;
}

.seller-order-money span{
    color:var(--muted);
}

.seller-order-money strong{
    color:var(--brand);
}

.seller-order-net{
    margin-top:4px;
    padding-top:12px !important;
}

.seller-order-net strong{
    font-size:1.05rem;
}

.seller-order-action-panel{
    background:#fcfdff;
}

.seller-order-actions{
    display:grid;
    gap:8px;
}

.seller-order-actions strong{
    color:var(--brand);
    margin-bottom:4px;
}

.seller-order-actions .btn{
    width:100%;
    min-height:38px;
    border-radius:999px;
    font-size:13px;
}

.seller-tracking-inputs{
    display:grid;
    gap:8px;
}

.seller-tracking-inputs input{
    width:100%;
    min-height:38px;
    padding:9px 11px;
    border:1px solid #dbe4ee;
    border-radius:12px;
    background:#fff;
    font:inherit;
    font-size:13px;
}

@media (max-width: 1180px){
    .seller-order-grid{
        grid-template-columns:1fr 1fr;
    }

    .seller-order-action-panel{
        grid-column:1 / -1;
    }
}

@media (max-width: 760px){
    .seller-orders-hero,
    .seller-order-card-head{
        flex-direction:column;
        align-items:flex-start;
    }

    .seller-orders-hero-actions{
        width:100%;
    }

    .seller-orders-hero-actions .btn{
        width:100%;
    }

    .seller-order-statuses{
        justify-content:flex-start;
    }

    .seller-order-grid{
        grid-template-columns:1fr;
    }

    .seller-order-panel{
        border-right:0;
    }
}

@media (max-width: 480px){
    .seller-orders-wrap{
        width:min(100% - 20px, 1200px);
        margin-top:18px;
    }

    .seller-orders-hero{
        padding:20px;
        border-radius:20px;
    }
}

.buyer-problem-box{
    width:100%;
    display:grid;
    gap:8px;
    margin-top:8px;
    padding:12px;
    border:1px solid #dbe7f1;
    border-radius:16px;
    background:#fbfdff;
}

.buyer-problem-box select,
.buyer-problem-box textarea{
    width:100%;
    border:1px solid #dbe4ee;
    border-radius:12px;
    padding:10px 12px;
    font:inherit;
    font-size:13px;
    background:#fff;
}

.buyer-problem-box textarea{
    resize:vertical;
    min-height:82px;
}

.seller-problem-report{
    margin-top:12px;
    padding:12px;
    border:1px solid #f4c9a6;
    border-radius:14px;
    background:#fff8ef;
}

.seller-problem-report strong{
    display:block;
    color:#8a4b00;
    margin-bottom:6px;
}

.seller-problem-report span,
.seller-problem-report small{
    display:block;
    color:#8a5a00;
    font-size:13px;
    line-height:1.45;
}

.seller-problem-report p{
    margin:8px 0;
    color:#4b5563;
    line-height:1.55;
    font-size:13px;
}

.buyer-problem-upload{
    display:grid;
    gap:6px;
    color:var(--brand);
    font-size:13px;
    font-weight:800;
}

.buyer-problem-upload input{
    width:100%;
    border:1px dashed #cbd8e3;
    border-radius:12px;
    padding:10px;
    background:#fff;
    font:inherit;
    color:var(--muted);
}

.seller-problem-evidence{
    display:grid;
    gap:8px;
    margin-top:10px;
    color:#8a4b00;
    font-size:13px;
    font-weight:900;
}

.seller-problem-evidence img{
    width:100%;
    max-width:220px;
    border-radius:12px;
    border:1px solid #f4c9a6;
    background:#fff;
    display:block;
}

.seller-refund-box{
    display:grid;
    gap:8px;
    padding:10px;
    border:1px solid #dbe7f1;
    border-radius:16px;
    background:#f8fbff;
}

.seller-refund-box label{
    display:grid;
    gap:6px;
    margin:0;
}

.seller-refund-box span{
    color:var(--brand);
    font-size:12px;
    font-weight:900;
}

.seller-refund-box input{
    width:100%;
    min-height:40px;
    padding:9px 12px;
    border:1px solid #ccd9e5;
    border-radius:12px;
    background:#fff;
    color:var(--brand);
    font:inherit;
    font-size:13px;
    font-weight:700;
    box-shadow:inset 0 1px 2px rgba(15,23,42,.04);
}

.seller-refund-box input:focus{
    outline:2px solid rgba(76,194,138,.28);
    border-color:#4cc28a;
}

.seller-refund-box .btn{
    margin-top:2px;
}

.buyer-order-price{
    display:grid;
    gap:4px;
    text-align:right;
}

.buyer-refund-line{
    color:#b42318;
    font-size:12px;
    font-weight:800;
}

.buyer-refund-original{
    color:var(--muted);
    font-size:12px;
    text-decoration:line-through;
}

/* ==========================================================================
   NOTIFICATION BELL POLISH
   ========================================================================== */

.shop-notification-btn{
    transition:background .15s ease, transform .15s ease, box-shadow .15s ease;
}

.shop-notification-btn:hover{
    transform:translateY(-1px);
    box-shadow:0 12px 24px rgba(34,63,95,.13);
}

.shop-notification-dropdown{
    width:370px;
    border-radius:20px;
}

.shop-notification-head{
    align-items:center;
}

.shop-notification-head > div{
    display:grid;
    gap:2px;
}

.shop-notification-head strong{
    font-size:15px;
}

.shop-notification-head span{
    display:block !important;
    font-size:12px;
    opacity:.82;
}

.shop-notification-head a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:30px;
    padding:0 10px;
    border-radius:999px;
    background:rgba(255,255,255,.16);
    color:#fff;
    font-size:12px;
    font-weight:900;
}

.shop-notification-item{
    position:relative;
    padding:14px 16px 14px 18px;
    transition:background .15s ease;
}

.shop-notification-item.is-unread::before{
    content:"";
    position:absolute;
    left:7px;
    top:18px;
    width:6px;
    height:6px;
    border-radius:999px;
    background:#ef4444;
}

.shop-notification-item.is-unread{
    background:#f2f8ff;
}

.shop-notification-item strong{
    font-size:13px;
    line-height:1.3;
}

.shop-notification-item span{
    font-size:12px;
    line-height:1.45;
}

.shop-notification-empty{
    text-align:center;
    padding:22px 16px;
}

@media (max-width: 480px){
    .shop-notification-dropdown{
        position:fixed;
        top:76px;
        right:10px;
        left:10px;
        width:auto;
        max-width:none;
    }
}

.seller-dashboard-page-main{
    padding:28px 0 40px;
    margin-top:0;
}