/* =========================================================================
   Comfy Classy — storefront styles
   Palette: soft blush pink + cream + warm gold
   ========================================================================= */
:root{
    --pink:#f4c2d0;
    --pink-deep:#e79bb0;
    --pink-soft:#fbe6ec;
    --rose:#c97a8e;
    --cream:#fdf8f4;
    --cream-2:#f7efe8;
    --gold:#c9a24a;
    --ink:#3f3338;
    --ink-soft:#7a6b70;
    --line:#ecdfe2;
    --white:#ffffff;
    --ok:#3c9d6e;
    --ok-bg:#e7f6ee;
    --err:#c0445a;
    --err-bg:#fbe7eb;
    --info-bg:#fdf1d8;
    --radius:14px;
    --radius-sm:9px;
    --shadow:0 8px 30px rgba(170,110,130,.12);
    --shadow-sm:0 3px 12px rgba(170,110,130,.10);
    --maxw:1200px;
    --font:'Poppins',system-ui,sans-serif;
    --serif:'Playfair Display',Georgia,serif;
}
.lang-ar{ --font:'Tajawal',system-ui,sans-serif; --serif:'Tajawal',sans-serif; }

*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{
    margin:0;font-family:var(--font);color:var(--ink);
    background:var(--cream);line-height:1.6;font-weight:400;
    -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.25;margin:0 0 .5em;color:var(--ink)}
.lang-ar h1,.lang-ar h2,.lang-ar h3,.lang-ar h4{font-weight:700}
.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 20px}
.muted{color:var(--ink-soft)}
.center{text-align:center}
.section{padding:54px 0}
.section-alt{background:var(--cream-2)}
.narrow{max-width:760px;margin:0 auto}
.section-title{font-size:1.9rem;text-align:center;margin-bottom:30px;position:relative}
.section-title.sm{font-size:1.4rem;text-align:start;margin-bottom:18px}
.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}
.section-head .section-title{text-align:start;margin:0}
.link-more{color:var(--rose);font-weight:500;font-size:.95rem}
.link-more.center{display:block;text-align:center;margin-top:14px}

/* Buttons */
.btn{
    display:inline-block;background:var(--rose);color:#fff;border:none;cursor:pointer;
    font-family:var(--font);font-weight:500;font-size:.98rem;padding:12px 26px;border-radius:50px;
    transition:.2s;text-align:center;line-height:1.2;
}
.btn:hover{background:#b56678;transform:translateY(-1px)}
.btn-lg{padding:15px 38px;font-size:1.05rem}
.btn-sm{padding:8px 18px;font-size:.86rem}
.btn-block{display:block;width:100%}
.btn-outline{background:transparent;color:var(--rose);border:1.5px solid var(--pink-deep)}
.btn-outline:hover{background:var(--pink-soft);color:var(--rose)}
.btn-whatsapp{background:#25d366;color:#fff;margin-top:12px}
.btn-whatsapp:hover{background:#1eb558;color:#fff}

/* Announcement + header */
.announcement{background:var(--rose);color:#fff;text-align:center;font-size:.82rem;padding:8px 16px;letter-spacing:.3px}
.site-header{position:sticky;top:0;z-index:40;background:rgba(253,248,244,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;gap:20px;height:72px}
.brand-name{font-family:var(--serif);font-size:1.5rem;font-weight:700;color:var(--rose);letter-spacing:.5px}
.brand-name span{color:var(--gold)}
.brand{display:flex;align-items:center}
.brand-logo{height:56px;width:auto;display:block}
.footer-logo{height:70px;width:auto;display:block;margin-bottom:14px}
.main-nav{display:flex;gap:22px;margin-inline-start:18px;flex:1}
.main-nav a{font-size:.95rem;font-weight:500;color:var(--ink);padding:6px 0;border-bottom:2px solid transparent;transition:.2s}
.main-nav a:hover{color:var(--rose);border-color:var(--pink-deep)}
/* nav dropdown for sub-categories */
.nav-drop{position:relative;display:flex;align-items:center}
.nav-drop>a{display:flex;align-items:center;gap:4px}
.nav-caret{font-size:.7rem;opacity:.7}
.nav-sub{position:absolute;top:100%;inset-inline-start:0;min-width:190px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow);padding:8px 0;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s;z-index:60}
.nav-drop:hover .nav-sub,.nav-drop:focus-within .nav-sub{opacity:1;visibility:visible;transform:translateY(0)}
.nav-sub a{display:block;padding:9px 18px;font-size:.92rem;border:none;white-space:nowrap}
.nav-sub a:hover{background:var(--pink-soft);color:var(--rose)}
.nav-offers{color:var(--gold)!important;font-weight:600}
.header-actions{display:flex;align-items:center;gap:14px;margin-inline-start:auto}
.lang-switch{font-size:.9rem;font-weight:600;color:var(--rose);border:1px solid var(--pink-deep);padding:5px 12px;border-radius:50px}
.lang-switch:hover{background:var(--pink-soft)}
.icon-link{position:relative;color:var(--ink);display:flex}
.icon-link:hover{color:var(--rose)}
.cart-count{position:absolute;top:-8px;inset-inline-end:-9px;background:var(--rose);color:#fff;font-size:.66rem;font-weight:600;min-width:17px;height:17px;border-radius:50px;display:flex;align-items:center;justify-content:center;padding:0 4px}
.cart-count[hidden]{display:none}
.nav-toggle{display:none;flex-direction:column;gap:4px;background:none;border:none;cursor:pointer;padding:6px}
.nav-toggle span{width:22px;height:2px;background:var(--ink);border-radius:2px}

/* Hero */
.hero{position:relative;min-height:clamp(380px,68vh,620px);display:flex;align-items:center;overflow:hidden;background:linear-gradient(120deg,var(--pink-soft),var(--cream-2))}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(63,51,56,.45),rgba(63,51,56,.12))}
.lang-ar .hero-overlay{background:linear-gradient(270deg,rgba(63,51,56,.45),rgba(63,51,56,.12))}
.hero-content{position:relative;color:#fff;max-width:600px}
.hero-content h1{color:#fff;font-size:clamp(2rem,5vw,3.4rem);text-shadow:0 2px 18px rgba(0,0,0,.25)}
.hero-content p{font-size:1.15rem;margin-bottom:26px;text-shadow:0 1px 10px rgba(0,0,0,.25)}

/* Category grid */
.category-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:18px}
.category-card{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:3/4;box-shadow:var(--shadow-sm);background:var(--pink-soft);flex:1 1 200px;max-width:260px}
.category-card img{width:100%;height:100%;object-fit:cover;transition:.4s}
.category-card-fallback{width:100%;height:100%;background:linear-gradient(135deg,var(--pink),var(--pink-soft))}
.category-card:hover img{transform:scale(1.06)}
.category-card span{position:absolute;inset-inline:0;bottom:0;background:linear-gradient(transparent,rgba(63,51,56,.8));color:#fff;font-family:var(--serif);font-weight:600;font-size:1.05rem;padding:28px 14px 14px;text-align:center}

/* Product grid + cards */
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:24px}
.product-card{background:var(--white);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);transition:.25s;display:flex;flex-direction:column}
.product-card:hover{box-shadow:var(--shadow);transform:translateY(-4px)}
.product-card-media{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;background:var(--pink-soft)}
.product-card-media img{width:100%;height:100%;object-fit:cover;transition:.4s}
.product-card:hover .product-card-media img{transform:scale(1.05)}
.badge{position:absolute;top:10px;inset-inline-start:10px;background:var(--gold);color:#fff;font-size:.68rem;font-weight:600;padding:4px 10px;border-radius:50px;letter-spacing:.4px}
.product-card-body{padding:14px 16px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.product-card-title{font-family:var(--font);font-size:1rem;font-weight:500;margin:0;line-height:1.35}
.product-card-title a:hover{color:var(--rose)}
.product-card-price{font-weight:600;color:var(--rose);font-size:1.05rem;margin-top:auto}
/* sale / special offers */
.price-old{text-decoration:line-through;color:var(--ink-soft);font-weight:400;font-size:.9em;margin-inline-end:6px}
.price-now{color:var(--err);font-weight:700}
.badge-sale{background:var(--err)}
.sale-tag{display:inline-block;background:var(--err);color:#fff;font-size:.8rem;font-weight:600;padding:3px 10px;border-radius:50px;margin-inline-start:8px;vertical-align:middle}
.section-offers{background:linear-gradient(180deg,var(--pink-soft),var(--cream))}
.cat-list .cat-sub{list-style:none;margin:2px 0 4px;padding-inline-start:14px;display:flex;flex-direction:column;gap:2px}
.cat-list .cat-sub a{font-size:.9rem;padding:7px 12px;color:var(--ink-soft)}
.cat-list .cat-offers{color:var(--gold);font-weight:600}

/* Shop layout */
.shop-head{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:26px}
.shop-head .section-title{text-align:start;margin:0}
.shop-search{display:flex;align-items:center;background:#fff;border:1px solid var(--line);border-radius:50px;overflow:hidden;box-shadow:var(--shadow-sm)}
.shop-search input{border:none;padding:11px 18px;font-family:var(--font);outline:none;background:transparent;min-width:200px}
.shop-search button{border:none;background:var(--rose);color:#fff;padding:0 16px;align-self:stretch;cursor:pointer;display:flex;align-items:center}
.shop-layout{display:grid;grid-template-columns:230px 1fr;gap:34px;align-items:start}
.shop-sidebar h4{font-family:var(--font);font-size:.82rem;text-transform:uppercase;letter-spacing:1px;color:var(--ink-soft);margin-bottom:12px}
.cat-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.cat-list a{display:block;padding:9px 14px;border-radius:var(--radius-sm);color:var(--ink);font-size:.95rem;transition:.18s}
.cat-list a:hover{background:var(--pink-soft)}
.cat-list a.active{background:var(--rose);color:#fff;font-weight:500}
.shop-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap;gap:10px}
.sort-form{display:flex;align-items:center;gap:8px}
.sort-form label{font-size:.88rem;color:var(--ink-soft)}
.sort-form select,.form-row select{font-family:var(--font);padding:8px 12px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;color:var(--ink);cursor:pointer}
.empty-state{text-align:center;padding:50px 0}
.empty-state .btn{margin-top:14px}

/* Product detail */
.breadcrumb{font-size:.85rem;color:var(--ink-soft);margin-bottom:22px}
.breadcrumb a:hover{color:var(--rose)}
.product-detail{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:start}
.product-gallery,.product-info{min-width:0}
.gallery-main{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);aspect-ratio:3/4;background:var(--pink-soft)}
.gallery-main img{width:100%;height:100%;object-fit:cover}
.gallery-thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.thumb{width:70px;height:90px;border-radius:var(--radius-sm);overflow:hidden;border:2px solid transparent;padding:0;cursor:pointer;background:none}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb.active{border-color:var(--rose)}
.product-cat-label{font-size:.8rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--gold);font-weight:600;margin-bottom:6px}
.product-info h1{font-size:2.1rem;margin-bottom:10px}
.product-price{font-size:1.7rem;font-weight:600;color:var(--rose);margin-bottom:20px}
.product-desc{color:var(--ink-soft);margin-bottom:24px;line-height:1.8}
.size-options{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.size-pill{position:relative;display:inline-block}
.size-pill input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.size-pill span{display:inline-block;padding:8px 16px;border:1.5px solid var(--line);border-radius:50px;cursor:pointer;transition:.18s;font-size:.9rem}
.size-pill input:checked+span{background:var(--rose);color:#fff;border-color:var(--rose)}
.qty-add{display:flex;gap:14px;align-items:center;margin-top:22px;flex-wrap:wrap}
.qty-stepper{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:50px;overflow:hidden}
.qty-stepper.sm{transform:scale(.9)}
.qty-stepper button{width:38px;height:42px;border:none;background:#fff;font-size:1.2rem;cursor:pointer;color:var(--ink)}
.qty-stepper button:hover{background:var(--pink-soft)}
.qty-stepper input{width:46px;text-align:center;border:none;font-family:var(--font);font-size:1rem;outline:none;-moz-appearance:textfield}
.qty-stepper input::-webkit-outer-spin-button,.qty-stepper input::-webkit-inner-spin-button{-webkit-appearance:none}
.related{margin-top:60px}
.related .section-title{text-align:start}

/* Forms / cards */
.card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:26px 28px;margin-bottom:24px}
.card h2{font-size:1.3rem;margin-bottom:18px}
.card h3{font-size:1.05rem;margin:20px 0 12px}
.form-row{margin-bottom:16px;display:flex;flex-direction:column;gap:6px}
.form-row label{font-size:.88rem;font-weight:500;color:var(--ink)}
.form-row input,.form-row textarea,.form-row select{
    font-family:var(--font);font-size:.97rem;padding:11px 14px;border:1px solid var(--line);
    border-radius:var(--radius-sm);background:#fff;color:var(--ink);width:100%;outline:none;transition:.18s;
}
.form-row input:focus,.form-row textarea:focus,.form-row select:focus{border-color:var(--pink-deep);box-shadow:0 0 0 3px var(--pink-soft)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.form-row.full{grid-column:1/-1}
.auth-card{max-width:440px;margin:0 auto}
.auth-card h1{text-align:center;font-size:1.7rem}
.auth-alt{text-align:center;margin-top:18px;font-size:.92rem;color:var(--ink-soft)}
.auth-alt a{color:var(--rose);font-weight:500}

/* Alerts */
.alert{padding:13px 18px;border-radius:var(--radius-sm);margin:16px 0;font-size:.95rem}
.alert-success{background:var(--ok-bg);color:var(--ok)}
.alert-error{background:var(--err-bg);color:var(--err)}
.alert-info{background:var(--info-bg);color:#9a7414}

/* Cart */
.cart-table{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden}
.cart-row{display:grid;grid-template-columns:3fr 1fr 1.2fr 1fr .4fr;align-items:center;gap:14px;padding:16px 20px;border-bottom:1px solid var(--line)}
.cart-row:last-child{border-bottom:none}
.cart-head{background:var(--cream-2);font-size:.8rem;text-transform:uppercase;letter-spacing:.6px;color:var(--ink-soft);font-weight:600}
.col-product{display:flex;align-items:center;gap:14px}
.cart-thumb{width:64px;height:80px;border-radius:var(--radius-sm);overflow:hidden;flex:none;background:var(--pink-soft)}
.cart-thumb img{width:100%;height:100%;object-fit:cover}
.cart-name{font-weight:500}
.cart-name:hover{color:var(--rose)}
.cart-size{font-size:.82rem;color:var(--ink-soft)}
.remove-btn{background:none;border:none;font-size:1.4rem;color:var(--ink-soft);cursor:pointer;line-height:1}
.remove-btn:hover{color:var(--err)}
.cart-footer{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-top:24px;flex-wrap:wrap}
.cart-summary{margin-inline-start:auto;min-width:300px;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:22px}
.summary-row{display:flex;justify-content:space-between;padding:8px 0;font-size:.95rem;border-bottom:1px dashed var(--line)}
.summary-row.grand{border-bottom:none;border-top:2px solid var(--line);margin-top:6px;padding-top:14px;font-size:1.15rem}
.summary-row.grand strong{color:var(--rose)}
.cart-summary .btn{margin-top:14px}

/* Checkout */
.checkout-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:28px;align-items:start}
.checkout-main,.checkout-aside,.shop-main{min-width:0}
.account-inline{border-top:1px dashed var(--line);margin-top:18px;padding-top:16px}
.pay-option{display:flex;gap:14px;align-items:flex-start;border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:16px;margin-bottom:12px;cursor:pointer;transition:.18s}
.pay-option:hover{border-color:var(--pink-deep)}
.pay-option input{margin-top:4px}
.pay-option p{margin:4px 0 0;font-size:.88rem}
.order-summary .summary-line{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.summary-line img{width:50px;height:62px;object-fit:cover;border-radius:8px;flex:none;background:var(--pink-soft)}
.summary-line-info{flex:1;font-size:.9rem;display:flex;flex-direction:column}
.summary-line-info small{color:var(--ink-soft)}
.summary-line-price{font-weight:500;font-size:.9rem}
.checkout-aside .order-summary{position:sticky;top:90px}

/* Order confirmation */
.order-confirm{text-align:center;margin-bottom:30px}
.confirm-check{width:70px;height:70px;border-radius:50%;background:var(--ok-bg);color:var(--ok);font-size:2rem;display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.order-no{font-size:1.05rem}
.next-steps{border:2px solid var(--pink-soft)}
.bank-table{width:100%;border-collapse:collapse;margin:6px 0 8px}
.bank-table td{padding:10px 12px;border-bottom:1px solid var(--line);font-size:.95rem}
.bank-table td:first-child{color:var(--ink-soft);width:42%}
.mono{font-family:ui-monospace,monospace;letter-spacing:.5px}

/* Account / orders table */
.account-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:30px;flex-wrap:wrap}
.orders-table{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden}
.orders-row{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr .6fr;gap:12px;align-items:center;padding:14px 20px;border-bottom:1px solid var(--line)}
.orders-row:last-child{border-bottom:none}
.orders-head{background:var(--cream-2);font-size:.78rem;text-transform:uppercase;letter-spacing:.6px;color:var(--ink-soft);font-weight:600}
.status-badge{display:inline-block;font-size:.76rem;font-weight:600;padding:4px 12px;border-radius:50px;background:var(--cream-2);color:var(--ink-soft)}
.status-pending{background:var(--info-bg);color:#9a7414}
.status-payment_submitted{background:#e6eefb;color:#2f6bd8}
.status-confirmed,.status-processing{background:#efe6fb;color:#7d4fd8}
.status-shipped{background:#e0f3f6;color:#1d8a9c}
.status-completed{background:var(--ok-bg);color:var(--ok)}
.status-cancelled{background:var(--err-bg);color:var(--err)}
.order-detail-head{display:flex;justify-content:space-between;align-items:center;gap:14px}

/* Footer */
.site-footer{background:var(--ink);color:#e9dde1;margin-top:40px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:34px;padding:50px 20px 30px}
.footer-brand{display:inline-block;margin-bottom:12px}
.footer-col p{font-size:.92rem;color:#c3b2b8;max-width:340px}
.footer-col h4{color:#fff;font-family:var(--font);font-size:.85rem;text-transform:uppercase;letter-spacing:1px;margin-bottom:14px}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.footer-col a{font-size:.93rem;color:#d6c6cb}
.footer-col a:hover{color:var(--pink)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:16px 0;font-size:.85rem;color:#b29ba2}
.footer-bottom .container{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.footer-credit a{color:var(--pink);font-weight:500}
.footer-credit a:hover{color:#fff}
@media(max-width:600px){.footer-bottom .container{justify-content:center;text-align:center}}

/* WhatsApp float */
.whatsapp-float{position:fixed;bottom:22px;inset-inline-end:22px;width:56px;height:56px;background:#25d366;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 20px rgba(37,211,102,.45);z-index:50;transition:.2s}
.whatsapp-float:hover{transform:scale(1.08)}

/* Responsive */
@media(max-width:900px){
    .shop-layout{grid-template-columns:1fr}
    .shop-sidebar{order:-1}
    .cat-list{flex-direction:row;flex-wrap:wrap}
    .product-detail{grid-template-columns:1fr;gap:26px}
    .checkout-layout{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
    .main-nav{position:fixed;inset:0 0 0 auto;width:78%;max-width:320px;background:var(--cream);flex-direction:column;padding:80px 26px;transform:translateX(110%);transition:.3s;box-shadow:var(--shadow);gap:6px;z-index:45}
    .lang-ar .main-nav{inset:0 auto 0 0;transform:translateX(-110%)}
    body.nav-open .main-nav{transform:translateX(0)}
    .main-nav a{padding:12px 0;border-bottom:1px solid var(--line)}
    .nav-drop{display:block}
    .nav-sub{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;background:transparent;padding:0;min-width:0}
    .nav-sub a{padding:9px 0 9px 16px;font-size:.9rem;color:var(--ink-soft)}
    .nav-caret{display:none}
    .nav-toggle{display:flex;order:-1}
    .header-inner{height:62px}
    .brand-logo{height:44px}
    .cart-row{grid-template-columns:1fr;gap:8px;position:relative}
    .cart-head{display:none}
    .cart-row .col-price,.cart-row .col-qty,.cart-row .col-total{display:flex;justify-content:space-between}
    .cart-row [data-label]::before{content:attr(data-label);color:var(--ink-soft);font-size:.85rem}
    .col-remove{position:absolute;top:14px;inset-inline-end:10px}
    .orders-row{grid-template-columns:1fr 1fr;gap:8px}
    .orders-head{display:none}
    .orders-row [data-label]::before{content:attr(data-label)": ";color:var(--ink-soft);font-size:.8rem}
    .form-grid{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr}
    .section{padding:40px 0}
}
