/* ============ Reset & Base ============ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  color:#1a1a1a;
  background:#faf7f2;
  line-height:1.6;
  font-size:15px;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;color:#1a1a1a;line-height:1.2}
h1{font-size:2.2rem;margin-bottom:1rem}
h2{font-size:1.8rem;margin-bottom:1rem}
h3{font-size:1.3rem;margin-bottom:.75rem}
a{color:#1a1a1a;text-decoration:none}
a:hover{color:#c9a961}
img{max-width:100%;display:block}
button{cursor:pointer;font-family:inherit}
input,select,textarea{
  font-family:inherit;font-size:14px;
  padding:.7rem .9rem;border:1px solid #d8d2c4;border-radius:4px;
  background:#fff;width:100%;color:#1a1a1a;
}
input:focus,select:focus,textarea:focus{outline:none;border-color:#c9a961}
.container{max-width:1280px;margin:0 auto;padding:0 1.25rem}
.muted{color:#7a7163}
.small{font-size:.85rem}
.text-danger{color:#c84b31}
.text-warn{color:#b8860b}
.text-ok{color:#4a7c59}

/* ============ Buttons ============ */
.btn{
  display:inline-block;padding:.85rem 1.8rem;border-radius:3px;
  font-size:.9rem;font-weight:500;letter-spacing:.5px;text-transform:uppercase;
  border:1px solid transparent;transition:all .2s;cursor:pointer;
}
.btn-primary{background:#1a1a1a;color:#faf7f2;border-color:#1a1a1a}
.btn-primary:hover{background:#c9a961;color:#1a1a1a;border-color:#c9a961}
.btn-outline{background:transparent;color:#1a1a1a;border-color:#1a1a1a}
.btn-outline:hover{background:#1a1a1a;color:#faf7f2}
.btn-block{display:block;width:100%;text-align:center}
.btn-link{background:none;border:none;color:#1a1a1a;text-decoration:underline;padding:0;font-size:.9rem}
.btn-link:hover{color:#c9a961}

/* ============ Announcement ============ */
.announcement{
  background:#1a1a1a;color:#faf7f2;text-align:center;
  padding:.55rem 1rem;font-size:.8rem;letter-spacing:.5px;
}

/* ============ Header ============ */
.header{
  background:#faf7f2;border-bottom:1px solid #e8e1d1;
  position:sticky;top:0;z-index:100;
}
.header-inner{
  display:flex;align-items:center;gap:2rem;
  padding:1rem 1.25rem;
}
.logo{display:flex;align-items:center;gap:.6rem;text-decoration:none}
.logo-mark{
  width:42px;height:42px;border-radius:50%;
  background:#1a1a1a;color:#c9a961;
  display:flex;align-items:center;justify-content:center;
  font-family:'Cormorant Garamond',serif;font-size:1.6rem;font-weight:700;
}
.logo-text{font-family:'Cormorant Garamond',serif;font-size:1.1rem;line-height:1;letter-spacing:1px}
.logo-text small{font-size:.65rem;letter-spacing:3px;color:#8b7355}
.nav{display:flex;gap:1.8rem;margin:0 auto}
.nav a{font-size:.85rem;text-transform:uppercase;letter-spacing:1.5px;font-weight:500;position:relative;padding:.3rem 0}
.nav a::after{
  content:"";position:absolute;left:0;bottom:-2px;width:0;height:1px;
  background:#c9a961;transition:width .3s;
}
.nav a:hover::after{width:100%}
.header-actions{display:flex;align-items:center;gap:.6rem}
.search-form input{
  padding:.5rem .8rem;border-radius:20px;border:1px solid #d8d2c4;
  background:#fff;width:160px;font-size:.85rem;
}
.icon-btn{
  position:relative;font-size:1.1rem;padding:.3rem .5rem;
  text-decoration:none;
}
.badge{
  position:absolute;top:-4px;right:-6px;
  background:#c9a961;color:#1a1a1a;
  font-size:.65rem;font-weight:600;
  min-width:18px;height:18px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;padding:0 4px;
}
.menu-toggle{display:none;background:none;border:none;font-size:1.5rem}

/* ============ Hero ============ */
.hero{
  background:linear-gradient(135deg,#f5efe3 0%,#ebe2cf 100%);
  padding:5rem 1.25rem;text-align:center;
  background-image:url('https://images.unsplash.com/photo-1558769132-cb1aea458c5e?w=1600&q=80');
  background-size:cover;background-position:center;
  position:relative;
}
.hero::before{
  content:"";position:absolute;inset:0;
  background:rgba(250,247,242,.82);
}
.hero-content{position:relative;max-width:700px;margin:0 auto}
.eyebrow{
  display:inline-block;font-size:.75rem;letter-spacing:3px;
  text-transform:uppercase;color:#8b7355;margin-bottom:1rem;
}
.hero h1{font-size:3rem;margin-bottom:1rem}
.hero p{color:#555;margin-bottom:2rem;font-size:1.05rem}
.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

/* ============ Sections ============ */
.section{padding:3.5rem 0}
.section-head{
  display:flex;justify-content:space-between;align-items:baseline;
  margin-bottom:1.5rem;padding-bottom:.75rem;border-bottom:1px solid #e8e1d1;
}
.link{color:#8b7355;font-size:.9rem;font-weight:500}
.link:hover{color:#c9a961}

/* ============ Category Tiles ============ */
.cat-tiles{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.cat-tile{
  position:relative;overflow:hidden;border-radius:4px;
  aspect-ratio:4/5;display:block;
}
.cat-tile-img{
  position:absolute;inset:0;background-size:cover;background-position:center;
  transition:transform .5s;
}
.cat-tile:hover .cat-tile-img{transform:scale(1.05)}
.cat-tile-label{
  position:absolute;bottom:1.5rem;left:1.5rem;color:#fff;
  text-shadow:0 2px 8px rgba(0,0,0,.4);
}
.cat-tile-label h3{color:#fff;font-size:2rem;margin:0}
.cat-tile-label span{font-size:.85rem;letter-spacing:2px;text-transform:uppercase}

/* ============ Product Grid ============ */
.product-grid{
  display:grid;gap:1.5rem;
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
}
.product-card{
  background:#fff;border-radius:4px;overflow:hidden;
  text-decoration:none;color:inherit;
  transition:transform .25s,box-shadow .25s;
  display:flex;flex-direction:column;
}
.product-card:hover{transform:translateY(-4px);box-shadow:0 10px 30px rgba(0,0,0,.08)}
.product-image{position:relative;aspect-ratio:4/5;overflow:hidden;background:#eee}
.product-image img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.product-card:hover .product-image img{transform:scale(1.04)}
.product-badges{position:absolute;top:.6rem;left:.6rem;display:flex;flex-direction:column;gap:.3rem}
.badge-tag{
  padding:.25rem .6rem;font-size:.7rem;font-weight:600;letter-spacing:1px;
  text-transform:uppercase;border-radius:2px;
}
.badge-tag.new{background:#1a1a1a;color:#faf7f2}
.badge-tag.sale{background:#c84b31;color:#fff}
.sold-out{
  position:absolute;inset:0;background:rgba(0,0,0,.5);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:.9rem;letter-spacing:2px;text-transform:uppercase;
}
.product-info{padding:1rem}
.product-brand{font-size:.7rem;color:#8b7355;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:.2rem}
.product-name{font-family:'Inter',sans-serif;font-size:.95rem;font-weight:500;margin-bottom:.5rem;line-height:1.3}
.product-price{display:flex;gap:.5rem;align-items:baseline;margin-bottom:.3rem}
.price-sale{font-weight:600;font-size:1rem}
.price-old{text-decoration:line-through;color:#999;font-size:.85rem}
.product-stock{font-size:.75rem}

/* ============ Promo Banner ============ */
.promo-banner{
  background:#1a1a1a;color:#faf7f2;text-align:center;padding:4rem 1.25rem;
  background-image:linear-gradient(135deg,#1a1a1a 0%,#3a3026 100%);
}
.promo-banner h3{color:#c9a961;font-size:2.5rem;margin-bottom:.5rem}
.promo-banner p{margin-bottom:1.5rem;color:#d8d2c4}
.promo-banner .btn-primary{background:#c9a961;color:#1a1a1a;border-color:#c9a961}
.promo-banner .btn-primary:hover{background:#faf7f2}

/* ============ Catalog ============ */
.catalog-head{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:2rem;flex-wrap:wrap;gap:1rem;
}
.catalog-layout{display:grid;grid-template-columns:240px 1fr;gap:2.5rem}
.filters{
  background:#fff;padding:1.5rem;border-radius:4px;
  border:1px solid #e8e1d1;height:fit-content;position:sticky;top:90px;
}
.filter-group{margin-bottom:1.5rem}
.filter-group h4{font-family:'Inter',sans-serif;font-size:.85rem;text-transform:uppercase;letter-spacing:1px;margin-bottom:.75rem;color:#8b7355}
.filter-group label{display:block;padding:.3rem 0;font-size:.9rem;cursor:pointer}
.filter-group input[type=radio],.filter-group input[type=checkbox]{margin-right:.5rem}
.sort-form{display:flex;align-items:center;gap:.75rem}
.sort-form select{width:auto;padding:.5rem .8rem}

/* ============ Product Detail ============ */
.breadcrumb{font-size:.85rem;color:#8b7355;margin-bottom:2rem}
.breadcrumb a{color:#8b7355}
.product-detail{display:grid;grid-template-columns:1fr 1fr;gap:3rem}
.gallery-main{background:#fff;border-radius:4px;overflow:hidden;aspect-ratio:4/5}
.gallery-main img{width:100%;height:100%;object-fit:cover}
.gallery-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;margin-top:.75rem}
.thumb{aspect-ratio:1;object-fit:cover;border-radius:3px;cursor:pointer;border:2px solid transparent;opacity:.7}
.thumb.active,.thumb:hover{border-color:#c9a961;opacity:1}
.product-brand-line{font-size:.75rem;letter-spacing:2px;text-transform:uppercase;color:#8b7355;margin-bottom:.5rem}
.product-summary h1{font-size:2rem;margin-bottom:1rem}
.product-price-big{display:flex;gap:.75rem;align-items:baseline;margin-bottom:1rem}
.product-price-big .price-sale{font-size:1.8rem;font-weight:600}
.product-price-big .price-old{font-size:1.1rem}
.option-group{margin-bottom:1.25rem}
.option-group label{display:block;font-size:.85rem;font-weight:500;margin-bottom:.5rem;text-transform:uppercase;letter-spacing:1px}
.size-options{display:flex;flex-wrap:wrap;gap:.5rem}
.size-chip{
  padding:.55rem 1rem;border:1px solid #d8d2c4;border-radius:3px;
  font-size:.85rem;cursor:pointer;background:#fff;
}
.size-chip:has(input:checked){background:#1a1a1a;color:#faf7f2;border-color:#1a1a1a}
.size-chip input{display:none}
.qty-row{margin-bottom:1.5rem}
.qty-selector{display:inline-flex;align-items:center;border:1px solid #d8d2c4;border-radius:3px;overflow:hidden}
.qty-selector button{background:#fff;border:none;width:36px;height:36px;font-size:1.1rem}
.qty-selector input{width:50px;text-align:center;border:none;padding:.5rem;border-radius:0}
.buy-actions{display:flex;gap:.75rem;margin-bottom:2rem;flex-wrap:wrap}
.buy-actions .btn{flex:1;min-width:140px;text-align:center}
.product-meta{border-top:1px solid #e8e1d1;padding-top:1.5rem;margin-bottom:1.5rem}
.product-meta p{margin-bottom:.5rem;font-size:.9rem}
.trust-row{display:flex;flex-wrap:wrap;gap:1rem;font-size:.8rem;color:#8b7355}

/* ============ Cart ============ */
.cart-layout{display:grid;grid-template-columns:1fr 360px;gap:2.5rem;align-items:start}
.cart-items{background:#fff;border-radius:4px;border:1px solid #e8e1d1}
.cart-item{
  display:grid;grid-template-columns:90px 1fr auto auto auto;
  gap:1rem;align-items:center;padding:1rem;
  border-bottom:1px solid #e8e1d1;
}
.cart-item:last-child{border-bottom:none}
.cart-item img{width:90px;height:110px;object-fit:cover;border-radius:3px}
.cart-item-info a{font-size:.95rem}
.price-line{font-weight:600;margin-top:.3rem}
.cart-item-total{font-weight:600;min-width:90px;text-align:right}
.cart-summary{
  background:#fff;border-radius:4px;border:1px solid #e8e1d1;
  padding:1.5rem;position:sticky;top:90px;
}
.summary-row{display:flex;justify-content:space-between;padding:.4rem 0;font-size:.95rem}
.summary-row.total{
  border-top:1px solid #e8e1d1;margin-top:.75rem;padding-top:.75rem;
  font-size:1.15rem;font-weight:600;
}
.summary-item{display:flex;justify-content:space-between;padding:.5rem 0;font-size:.9rem;border-bottom:1px dashed #e8e1d1}

/* ============ Checkout ============ */
.checkout-layout{display:grid;grid-template-columns:1fr 380px;gap:2.5rem;align-items:start}
.checkout-form h3{margin-top:1.5rem;margin-bottom:.75rem;font-family:'Inter',sans-serif;font-size:1rem;text-transform:uppercase;letter-spacing:1px;color:#8b7355}
.checkout-form h3:first-child{margin-top:0}
.form-row{margin-bottom:.75rem}
.form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:.75rem}
.form-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.75rem;margin-bottom:.75rem}
.saved-addresses{display:grid;gap:.5rem;margin-bottom:1rem}
.address-card{
  display:flex;gap:.75rem;padding:.75rem;border:1px solid #d8d2c4;
  border-radius:4px;cursor:pointer;background:#fff;font-size:.9rem;
}
.address-card:has(input:checked){border-color:#c9a961;background:#fbf7ec}
.pay-option{
  display:flex;gap:.75rem;padding:.75rem;border:1px solid #d8d2c4;
  border-radius:4px;margin-bottom:.5rem;cursor:pointer;background:#fff;
}
.pay-option:has(input:checked){border-color:#c9a961;background:#fbf7ec}
.coupon-row{display:flex;gap:.5rem}

/* ============ Auth ============ */
.auth-wrap{max-width:440px;margin:0 auto}
.auth-card{background:#fff;padding:2.5rem;border-radius:4px;border:1px solid #e8e1d1}
.auth-card h1{text-align:center}
.auth-card form{display:flex;flex-direction:column;gap:.75rem;margin:1.5rem 0}
.auth-foot{text-align:center;font-size:.9rem}

/* ============ Account ============ */
.account-layout{display:grid;grid-template-columns:220px 1fr;gap:2rem}
.account-nav{background:#fff;padding:1rem;border-radius:4px;border:1px solid #e8e1d1;height:fit-content}
.account-nav a{display:block;padding:.6rem .75rem;border-radius:3px;font-size:.9rem}
.account-nav a.active,.account-nav a:hover{background:#fbf7ec;color:#c9a961}
.account-main{background:#fff;padding:2rem;border-radius:4px;border:1px solid #e8e1d1}
.account-main form{display:flex;flex-direction:column;gap:.75rem;max-width:500px}
.address-card-static{padding:1rem;border:1px solid #e8e1d1;border-radius:4px;margin-bottom:.5rem;font-size:.9rem}

/* ============ Orders ============ */
.orders-list{display:flex;flex-direction:column;gap:.75rem}
.order-card{
  display:grid;grid-template-columns:1fr auto auto auto;gap:1rem;align-items:center;
  padding:1rem 1.25rem;background:#fff;border:1px solid #e8e1d1;border-radius:4px;
  text-decoration:none;color:inherit;
}
.order-card:hover{border-color:#c9a961}
.status-pill{
  display:inline-block;padding:.25rem .75rem;border-radius:12px;
  font-size:.75rem;font-weight:500;letter-spacing:.5px;text-transform:uppercase;
}
.status-pending{background:#fff4d6;color:#8b6914}
.status-confirmed{background:#d6e9ff;color:#1e5fa8}
.status-shipped{background:#e0d6ff;color:#5a3ea8}
.status-delivered{background:#d6f0dd;color:#2d6a3e}
.status-cancelled{background:#fde0dc;color:#a83e1e}
.order-detail{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;background:#fff;padding:1.5rem;border-radius:4px;border:1px solid #e8e1d1}
.order-table{width:100%;border-collapse:collapse;background:#fff}
.order-table th,.order-table td{padding:.75rem;text-align:left;border-bottom:1px solid #e8e1d1;font-size:.9rem}
.order-table th{background:#fbf7ec;font-weight:500;text-transform:uppercase;font-size:.75rem;letter-spacing:1px}
.order-totals{background:#fff;padding:1.5rem;border-radius:4px;border:1px solid #e8e1d1;max-width:400px;margin-top:1rem;margin-left:auto}

/* ============ Footer ============ */
.footer{background:#1a1a1a;color:#d8d2c4;padding:3.5rem 0 1rem;margin-top:3rem}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:2.5rem}
.footer h4{color:#c9a961;font-family:'Cormorant Garamond',serif;font-size:1.2rem;margin-bottom:1rem}
.footer ul{list-style:none}
.footer ul li{margin-bottom:.5rem;font-size:.9rem}
.footer a{color:#d8d2c4}
.footer a:hover{color:#c9a961}
.socials{display:flex;gap:.75rem;margin-top:.75rem}
.socials a{
  width:36px;height:36px;border:1px solid #3a3026;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600;
}
.socials a:hover{background:#c9a961;color:#1a1a1a;border-color:#c9a961}
.footer-bottom{border-top:1px solid #3a3026;margin-top:2.5rem;padding-top:1rem;text-align:center;font-size:.8rem;color:#7a7163}

/* ============ Flash ============ */
.flash{padding:.75rem 1rem;border-radius:4px;margin:1rem 0;font-size:.9rem}
.flash-success{background:#d6f0dd;color:#2d6a3e;border:1px solid #a8d4b5}
.flash-error{background:#fde0dc;color:#a83e1e;border:1px solid #f5b5ab}
.flash-warning{background:#fff4d6;color:#8b6914;border:1px solid #f0d98a}
.flash-info{background:#d6e9ff;color:#1e5fa8;border:1px solid #a8c8f0}

/* ============ Modal ============ */
.modal{
  position:fixed;inset:0;background:rgba(0,0,0,.5);
  display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;
}
.modal-content{background:#fff;padding:2rem;border-radius:4px;max-width:500px;width:100%;position:relative}
.modal-close{position:absolute;top:.5rem;right:.75rem;background:none;border:none;font-size:1.5rem}
.size-table{width:100%;border-collapse:collapse;margin-top:1rem}
.size-table th,.size-table td{padding:.5rem;border:1px solid #e8e1d1;text-align:center;font-size:.9rem}
.size-table th{background:#fbf7ec}

/* ============ Admin ============ */
.admin-body{display:flex;min-height:100vh;background:#f5f1e8}
.admin-sidebar{
  width:240px;background:#1a1a1a;color:#d8d2c4;
  padding:1.5rem 1rem;flex-shrink:0;
}
.admin-logo{font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:#c9a961;margin-bottom:2rem;letter-spacing:2px}
.admin-logo small{font-size:.7rem;letter-spacing:4px;color:#8b7355;display:block}
.admin-sidebar nav{display:flex;flex-direction:column;gap:.25rem}
.admin-sidebar nav a{
  color:#d8d2c4;padding:.65rem .9rem;border-radius:4px;font-size:.9rem;
}
.admin-sidebar nav a:hover,.admin-sidebar nav a.active{background:#2a241c;color:#c9a961}
.admin-sidebar hr{border:none;border-top:1px solid #3a3026;margin:1rem 0}
.admin-main{flex:1;padding:2rem;overflow-x:auto}
.admin-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-bottom:2rem}
.stat-card{background:#fff;padding:1.25rem;border-radius:4px;border:1px solid #e8e1d1}
.stat-label{font-size:.75rem;text-transform:uppercase;letter-spacing:1.5px;color:#8b7355;margin-bottom:.5rem}
.stat-value{font-size:1.8rem;font-weight:600;font-family:'Cormorant Garamond',serif}
.stat-card.warn{background:#fff4d6;border-color:#f0d98a}
.admin-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.admin-table{width:100%;border-collapse:collapse;background:#fff;border-radius:4px;overflow:hidden}
.admin-table th,.admin-table td{padding:.75rem;text-align:left;border-bottom:1px solid #e8e1d1;font-size:.9rem}
.admin-table th{background:#fbf7ec;font-size:.75rem;text-transform:uppercase;letter-spacing:1px;color:#8b7355}
.admin-form{background:#fff;padding:2rem;border-radius:4px;border:1px solid #e8e1d1;max-width:900px}
.admin-form label{display:block;font-size:.85rem;font-weight:500;margin-bottom:.3rem;margin-top:.75rem;text-transform:uppercase;letter-spacing:.5px;color:#555}
.admin-form label:first-child{margin-top:0}
.checkbox-row{display:flex;flex-wrap:wrap;gap:1rem;margin:1rem 0;padding:1rem;background:#fbf7ec;border-radius:4px}
.checkbox-row label{display:flex;align-items:center;gap:.4rem;margin:0;text-transform:none;font-size:.9rem}
.image-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.75rem;margin-top:1rem}
.image-thumb{position:relative;background:#fff;border:1px solid #e8e1d1;border-radius:4px;padding:.5rem}
.image-thumb img{aspect-ratio:1;object-fit:cover;border-radius:3px}
.form-actions{display:flex;gap:.75rem;margin-top:2rem}
.filter-bar{display:flex;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap}
.filter-bar a{padding:.5rem 1rem;border:1px solid #d8d2c4;border-radius:20px;font-size:.85rem;background:#fff}
.filter-bar a.active{background:#1a1a1a;color:#faf7f2;border-color:#1a1a1a}
.tag{display:inline-block;padding:.2rem .5rem;background:#fbf7ec;color:#8b7355;border-radius:3px;font-size:.7rem;margin-right:.25rem;text-transform:uppercase;letter-spacing:.5px}
.tag.sale{background:#fde0dc;color:#a83e1e}
.empty{text-align:center;padding:3rem;color:#8b7355}

/* ============ Responsive ============ */
@media (max-width: 960px){
  .catalog-layout{grid-template-columns:1fr}
  .filters{position:static}
  .product-detail{grid-template-columns:1fr}
  .cart-layout,.checkout-layout{grid-template-columns:1fr}
  .cart-summary{position:static}
  .account-layout{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr;gap:2rem}
  .order-detail{grid-template-columns:1fr}
  .admin-grid-2{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .menu-toggle{display:block}
  .nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    background:#faf7f2;flex-direction:column;padding:1rem;
    border-bottom:1px solid #e8e1d1;gap:.5rem;
  }
  .nav.open{display:flex}
  .nav a{padding:.5rem 0}
  .search-form{display:none}
  .hero h1{font-size:2rem}
  .hero{padding:3rem 1.25rem}
  .cat-tiles{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .cart-item{grid-template-columns:70px 1fr;gap:.75rem}
  .cart-item .qty-selector,.cart-item-total,.cart-item form:last-child{grid-column:2}
  .form-row-2,.form-row-3{grid-template-columns:1fr}
  .order-card{grid-template-columns:1fr;text-align:left}
  .admin-sidebar{width:60px;padding:.5rem}
  .admin-sidebar .admin-logo{font-size:.9rem;text-align:center}
  .admin-sidebar .admin-logo small{display:none}
  .admin-sidebar nav a{font-size:0;padding:.65rem .4rem;text-align:center}
  .admin-sidebar nav a::before{font-size:1.1rem}
  .admin-sidebar nav a:nth-child(1)::before{content:"📊"}
  .admin-sidebar nav a:nth-child(2)::before{content:"🛍"}
  .admin-sidebar nav a:nth-child(3)::before{content:"📦"}
  .admin-sidebar nav a:nth-child(4)::before{content:"👥"}
  .admin-sidebar nav a:nth-child(6)::before{content:"🌐"}
  .admin-sidebar nav a:nth-child(7)::before{content:"↩"}
}

/* ============ Google Shopping Style Product Cards ============ */
.product-grid-admin {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.product-card-admin {
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #e8e1d1;
  transition: transform .2s, box-shadow .2s;
  display: flex;
  flex-direction: column;
}

.product-card-admin:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,.1);
}

.product-image-admin {
  position: relative;
  aspect-ratio: 4/5;
  overflow: hidden;
  background: #f5f1e8;
}

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

.product-badges-admin {
  position: absolute;
  top: .75rem;
  left: .75rem;
  display: flex;
  flex-direction: column;
  gap: .4rem;
}

.badge-tag.out {
  background: #c84b31;
  color: #fff;
}

.badge-tag.low {
  background: #b8860b;
  color: #fff;
}

.inactive-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.6);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.product-info-admin {
  padding: 1.25rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.product-brand-admin {
  font-size: .7rem;
  color: #8b7355;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: .3rem;
}

.product-name-admin {
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: .3rem;
  line-height: 1.3;
}

.product-category-admin {
  font-size: .8rem;
  color: #7a7163;
  margin-bottom: .75rem;
}

.product-price-admin {
  display: flex;
  gap: .5rem;
  align-items: baseline;
  margin-bottom: 1rem;
}

.product-price-admin .price-sale {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1a1a1a;
}

.product-price-admin .price-old {
  text-decoration: line-through;
  color: #999;
  font-size: .9rem;
}

.product-stats-admin {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .5rem;
  padding: .75rem 0;
  border-top: 1px solid #e8e1d1;
  border-bottom: 1px solid #e8e1d1;
  margin-bottom: 1rem;
}

.product-stats-admin .stat {
  text-align: center;
}

.product-stats-admin .stat-label {
  display: block;
  font-size: .7rem;
  color: #8b7355;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: .2rem;
}

.product-stats-admin .stat-value {
  display: block;
  font-size: 1.1rem;
  font-weight: 600;
  color: #1a1a1a;
}

.product-actions-admin {
  display: flex;
  gap: .5rem;
}

.btn-sm {
  padding: .5rem 1rem;
  font-size: .8rem;
  flex: 1;
  text-align: center;
}

@media (max-width: 720px) {
  .product-grid-admin {
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  }
}

/* ============ Payment Instructions ============ */
.payment-instructions-card {
  max-width: 700px;
  margin: 0 auto;
  background: #fff;
  padding: 3rem;
  border-radius: 8px;
  border: 1px solid #e8e1d1;
  text-align: center;
}

.success-icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: #d6f0dd;
  color: #2d6a3e;
  font-size: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.5rem;
}

.order-number {
  font-size: 1.1rem;
  color: #8b7355;
  margin-bottom: 2rem;
}

.payment-box {
  background: #fbf7ec;
  border: 2px solid #c9a961;
  border-radius: 8px;
  padding: 2rem;
  margin: 2rem 0;
  text-align: left;
}

.payment-box h2 {
  text-align: center;
  margin-bottom: 1.5rem;
}

.payment-details {
  background: #fff;
  padding: 1.5rem;
  border-radius: 6px;
  margin-bottom: 1.5rem;
}

.detail-row {
  display: flex;
  justify-content: space-between;
  padding: .75rem 0;
  border-bottom: 1px solid #e8e1d1;
}

.detail-row:last-child {
  border-bottom: none;
}

.detail-row .label {
  font-weight: 500;
  color: #555;
}

.detail-row .value {
  font-weight: 600;
}

.detail-row .value.highlight {
  color: #c9a961;
  font-size: 1.2rem;
}

.total-row {
  background: #fbf7ec;
  margin: 0 -1.5rem;
  padding: 1rem 1.5rem;
  border-radius: 0 0 6px 6px;
}

.instructions {
  margin: 1.5rem 0;
}

.instructions h3 {
  font-size: 1.1rem;
  margin-bottom: 1rem;
}

.instructions ol {
  padding-left: 1.5rem;
  line-height: 1.8;
}

.upload-section {
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid #e8e1d1;
}

.file-upload {
  margin: 1rem 0;
}

.file-upload input[type="file"] {
  display: none;
}

.file-upload-label {
  display: inline-block;
  padding: 1rem 2rem;
  background: #fff;
  border: 2px dashed #c9a961;
  border-radius: 6px;
  cursor: pointer;
  transition: all .2s;
}

.file-upload-label:hover {
  background: #fbf7ec;
}

.proof-uploaded {
  background: #d6f0dd;
  padding: 1.5rem;
  border-radius: 6px;
  margin: 1rem 0;
}

.proof-preview {
  max-width: 300px;
  max-height: 400px;
  border-radius: 6px;
  margin: 1rem 0;
  border: 1px solid #e8e1d1;
}

.proof-preview-large {
  max-width: 500px;
  max-height: 600px;
  border-radius: 6px;
  margin: 1rem auto;
  display: block;
  border: 1px solid #e8e1d1;
}

.payment-proof-section {
  background: #fff;
  padding: 2rem;
  border-radius: 8px;
  border: 1px solid #e8e1d1;
  margin-top: 2rem;
  text-align: center;
}

.order-summary-mini {
  background: #fff;
  padding: 1.5rem;
  border-radius: 6px;
  border: 1px solid #e8e1d1;
  margin: 2rem 0;
  text-align: left;
}

.action-buttons {
  display: flex;
  gap: 1rem;
  justify-content: center;
  margin-top: 2rem;
}

.payment-method-box {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}

@media (max-width: 720px) {
  .payment-instructions-card {
    padding: 1.5rem;
  }
  .action-buttons {
    flex-direction: column;
  }
}
/* ============ Features Bar ============ */
.features-bar {
  background: #fff;
  border-top: 1px solid #e8e1d1;
  border-bottom: 1px solid #e8e1d1;
  padding: 2rem 0;
}
.features-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}
.feature {
  display: flex;
  align-items: center;
  gap: .75rem;
  justify-content: center;
}
.feature-icon {
  font-size: 1.8rem;
}
.feature strong {
  font-size: .9rem;
  display: block;
}
@media (max-width: 720px) {
  .features-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ============ Shopify-Style Checkout ============ */
.checkout-page {
  background: #f5f1e8;
  min-height: 80vh;
  padding: 2rem 0 4rem;
}
.checkout-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.25rem;
}
.checkout-breadcrumb {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid #e8e1d1;
}
.checkout-logo-small {
  display: flex;
  align-items: center;
  gap: .5rem;
  text-decoration: none;
  color: #1a1a1a;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem;
  font-weight: 600;
  letter-spacing: 1px;
}
.logo-mark-sm {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #1a1a1a;
  color: #c9a961;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  font-weight: 700;
}
.step-link {
  color: #8b7355;
  font-size: .9rem;
  text-decoration: none;
}
.step-link:hover {
  color: #c9a961;
}
.checkout-main {
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 2.5rem;
  align-items: start;
}
.checkout-form-col {
  background: #fff;
  padding: 2rem;
  border-radius: 8px;
  border: 1px solid #e8e1d1;
}
.checkout-section {
  padding-bottom: 1.75rem;
  margin-bottom: 1.75rem;
  border-bottom: 1px solid #e8e1d1;
}
.checkout-section:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.section-title {
  font-family: 'Inter', sans-serif;
  font-size: 1.1rem;
  font-weight: 600;
  margin-bottom: 1rem;
  color: #1a1a1a;
}
.checkout-input {
  width: 100%;
  padding: .85rem 1rem;
  border: 1px solid #d8d2c4;
  border-radius: 6px;
  font-size: .95rem;
  background: #fff;
  margin-bottom: .75rem;
  font-family: inherit;
}
.checkout-input:focus {
  outline: none;
  border-color: #1a1a1a;
  box-shadow: 0 0 0 3px rgba(26,26,26,.08);
}
.checkout-row-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
}
.checkout-row-3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: .75rem;
}
.checkbox-inline {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .9rem;
  color: #555;
  margin-top: .5rem;
  cursor: pointer;
}
.logged-in-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem;
  background: #fbf7ec;
  border: 1px solid #e8e1d1;
  border-radius: 6px;
  font-size: .95rem;
}
.logged-in-box a {
  color: #8b7355;
  text-decoration: underline;
  font-size: .9rem;
}

/* Saved addresses */
.saved-addresses-compact {
  display: flex;
  gap: 1rem;
  margin-bottom: 1rem;
}
.address-option {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .9rem;
  cursor: pointer;
}

/* Shipping option */
.shipping-option {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem;
  border: 1px solid #1a1a1a;
  border-radius: 6px;
  background: #fff;
}
.shipping-radio {
  display: flex;
  align-items: center;
  gap: .75rem;
}
.shipping-radio label {
  cursor: pointer;
}
.shipping-price {
  font-weight: 600;
  font-size: 1rem;
}

/* Payment */
.payment-option-selected {
  border: 2px solid #1a1a1a;
  border-radius: 8px;
  overflow: hidden;
}
.payment-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.25rem;
  background: #fbf7ec;
}
.payment-radio {
  display: flex;
  align-items: center;
  gap: .75rem;
}
.payment-radio label {
  display: flex;
  align-items: center;
  gap: .75rem;
  cursor: pointer;
  font-size: 1rem;
}
.payment-badge {
  background: #c9a961;
  color: #1a1a1a;
  padding: .15rem .6rem;
  border-radius: 10px;
  font-size: .7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.payment-logo {
  height: 28px;
}
.payment-details-box {
  padding: 1rem 1.25rem;
  background: #fff;
  font-size: .9rem;
  color: #555;
  border-top: 1px solid #e8e1d1;
}

/* Order Summary */
.checkout-summary-col {
  position: sticky;
  top: 90px;
}
.checkout-summary {
  background: #fff;
  padding: 1.75rem;
  border-radius: 8px;
  border: 1px solid #e8e1d1;
}
.summary-title {
  font-family: 'Inter', sans-serif;
  font-size: 1.1rem;
  font-weight: 600;
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e8e1d1;
}
.summary-items {
  max-height: 320px;
  overflow-y: auto;
  margin-bottom: 1rem;
  padding-right: .25rem;
}
.summary-item-new {
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: .75rem;
  padding: .75rem 0;
  border-bottom: 1px solid #f0ebe0;
  align-items: start;
}
.summary-item-new:last-child {
  border-bottom: none;
}
.summary-item-img {
  position: relative;
  width: 64px;
  height: 80px;
  border-radius: 6px;
  overflow: hidden;
  background: #f5f1e8;
}
.summary-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.item-qty-badge {
  position: absolute;
  top: -6px;
  right: -6px;
  background: #8b7355;
  color: #fff;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .75rem;
  font-weight: 600;
}
.summary-item-info {
  min-width: 0;
}
.item-name {
  font-size: .9rem;
  font-weight: 500;
  line-height: 1.3;
  margin-bottom: .25rem;
}
.item-meta {
  font-size: .8rem;
  color: #8b7355;
}
.item-price {
  font-weight: 600;
  font-size: .95rem;
  white-space: nowrap;
}

/* Discount */
.discount-section {
  padding: 1rem 0;
  border-top: 1px solid #e8e1d1;
  border-bottom: 1px solid #e8e1d1;
  margin-bottom: 1rem;
}
.discount-input-wrap {
  display: flex;
  gap: .5rem;
}
.discount-input-wrap input {
  flex: 1;
  margin-bottom: 0;
}
.btn-apply {
  padding: .75rem 1.25rem;
  background: #fff;
  border: 1px solid #8b7355;
  color: #8b7355;
  border-radius: 6px;
  font-size: .85rem;
  font-weight: 500;
  cursor: pointer;
  transition: all .2s;
}
.btn-apply:hover {
  background: #8b7355;
  color: #fff;
}

/* Totals */
.summary-totals {
  padding: .5rem 0;
}
.total-row {
  display: flex;
  justify-content: space-between;
  padding: .5rem 0;
  font-size: .95rem;
}
.total-final {
  font-size: 1.2rem;
  font-weight: 700;
  padding-top: 1rem;
  margin-top: .5rem;
  border-top: 2px solid #1a1a1a;
}
.btn-complete-order {
  width: 100%;
  padding: 1.1rem;
  background: #c9a961;
  color: #1a1a1a;
  border: none;
  border-radius: 6px;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: .5px;
  cursor: pointer;
  margin-top: 1.25rem;
  transition: all .2s;
}
.btn-complete-order:hover {
  background: #1a1a1a;
  color: #faf7f2;
}
.trust-signals {
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  margin-top: 1rem;
  font-size: .8rem;
  color: #8b7355;
}

@media (max-width: 900px) {
  .checkout-main {
    grid-template-columns: 1fr;
  }
  .checkout-summary-col {
    position: static;
  }
  .checkout-row-3 {
    grid-template-columns: 1fr;
  }
}

/* ============ Image URL Fields (Admin) ============ */
.image-urls-section {
  margin-top: 2rem;
  padding: 1.5rem;
  background: #fbf7ec;
  border-radius: 6px;
  border: 1px solid #e8e1d1;
}

.image-url-row {
  display: flex;
  gap: .5rem;
  margin-bottom: .5rem;
  align-items: center;
}

.image-url-row input {
  flex: 1;
}

.cloudinary-help {
  margin-top: 1.5rem;
  padding: 1rem;
  background: #fff;
  border-radius: 4px;
  border: 1px solid #e8e1d1;
}

.cloudinary-help h4 {
  font-size: .9rem;
  margin-bottom: .5rem;
  color: #8b7355;
}

.cloudinary-help ol {
  padding-left: 1.5rem;
  font-size: .85rem;
  line-height: 1.6;
}

.cloudinary-help a {
  color: #c9a961;
  text-decoration: underline;
}

/* WhatsApp instructions */
.whatsapp-instructions {
  text-align: center;
  padding: 1.5rem;
  background: #fff;
  border-radius: 6px;
  border: 1px solid #e8e1d1;
}

.whatsapp-instructions p {
  margin-bottom: 1rem;
}

/* ============ SHOPIFY-STYLE CHECKOUT ============ */
.shopify-checkout {
  background: #faf7f2;
  min-height: 100vh;
  font-family: 'Inter', system-ui, sans-serif;
  color: #1a1a1a;
  padding-bottom: 3rem;
}

/* Top Bar */
.sc-topbar {
  background: #fff;
  border-bottom: 1px solid #e8e1d1;
  padding: 1.25rem 0;
}
.sc-topbar-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.sc-logo {
  display: flex;
  align-items: center;
  gap: .6rem;
  text-decoration: none;
  color: #1a1a1a;
}
.sc-logo-mark {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #1a1a1a;
  color: #c9a961;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.3rem;
  font-weight: 700;
}
.sc-logo-text {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem;
  font-weight: 600;
  letter-spacing: 1.5px;
}
.sc-cart-link {
  display: flex;
  align-items: center;
  gap: .4rem;
  color: #5f6b7a;
  font-size: .9rem;
}
.sc-cart-link a {
  color: #5f6b7a;
  text-decoration: none;
}
.sc-cart-link a:hover {
  color: #c9a961;
}

/* Breadcrumb */
.sc-breadcrumb {
  padding: 1rem 0;
  border-bottom: 1px solid #e8e1d1;
  background: #fff;
}
.sc-breadcrumb-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
.sc-breadcrumb a {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  color: #5f6b7a;
  text-decoration: none;
  font-size: .9rem;
}
.sc-breadcrumb a:hover {
  color: #c9a961;
}

/* Main Layout */
.sc-main {
  max-width: 1100px;
  margin: 2rem auto 0;
  padding: 0 1.5rem;
}
.sc-container {
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 2.5rem;
  align-items: start;
}

/* Sections */
.sc-section {
  background: #fff;
  border: 1px solid #e8e1d1;
  border-radius: 8px;
  margin-bottom: 1rem;
  overflow: hidden;
}
.sc-section-last {
  margin-bottom: 0;
}
.sc-section-header {
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid #e8e1d1;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: .5rem;
}
.sc-section-header h2 {
  font-family: 'Inter', sans-serif;
  font-size: 1.05rem;
  font-weight: 600;
  margin: 0;
  color: #1a1a1a;
}
.sc-section-sub {
  font-size: .85rem;
  color: #5f6b7a;
}
.sc-section-body {
  padding: 1.5rem;
}

/* Fields */
.sc-field {
  margin-bottom: 1rem;
}
.sc-field:last-child {
  margin-bottom: 0;
}
.sc-field label {
  display: block;
  font-size: .85rem;
  font-weight: 500;
  color: #1a1a1a;
  margin-bottom: .4rem;
}
.sc-field input,
.sc-field select {
  width: 100%;
  padding: .85rem 1rem;
  border: 1px solid #d8d2c4;
  border-radius: 6px;
  font-size: .95rem;
  background: #fff;
  font-family: inherit;
  color: #1a1a1a;
  transition: border-color .15s, box-shadow .15s;
}
.sc-field input:focus,
.sc-field select:focus {
  outline: none;
  border-color: #1a1a1a;
  box-shadow: 0 0 0 3px rgba(26,26,26,.08);
}
.sc-field input::placeholder {
  color: #9aa3af;
}
.sc-row-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1rem;
}
.sc-row-3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1rem;
}

/* Checkbox */
.sc-checkbox {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .9rem;
  color: #5f6b7a;
  margin-top: 1rem;
  cursor: pointer;
  user-select: none;
}
.sc-checkbox input {
  width: 16px;
  height: 16px;
  accent-color: #1a1a1a;
}

/* Logged in box */
.sc-logged-in {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.25rem;
  background: #fbf7ec;
  border: 1px solid #e8e1d1;
  border-radius: 6px;
  font-size: .95rem;
}
.sc-logged-in a {
  color: #5f6b7a;
  text-decoration: underline;
  font-size: .9rem;
}

/* Address toggle */
.sc-address-toggle {
  display: flex;
  gap: .5rem;
  margin-bottom: 1.25rem;
}
.sc-radio-pill {
  display: flex;
  align-items: center;
  gap: .4rem;
  padding: .6rem 1rem;
  border: 1px solid #d8d2c4;
  border-radius: 20px;
  font-size: .85rem;
  cursor: pointer;
  transition: all .15s;
  background: #fff;
}
.sc-radio-pill:has(input:checked) {
  background: #1a1a1a;
  color: #faf7f2;
  border-color: #1a1a1a;
}
.sc-radio-pill input {
  display: none;
}

/* Shipping option */
.sc-shipping-option {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.25rem;
  border: 1px solid #1a1a1a;
  border-radius: 6px;
  background: #fff;
}
.sc-shipping-radio {
  display: flex;
  align-items: center;
  gap: .75rem;
}
.sc-shipping-radio label {
  cursor: pointer;
}
.sc-shipping-radio strong {
  display: block;
  font-size: .95rem;
  margin-bottom: .15rem;
}
.sc-shipping-time {
  font-size: .8rem;
  color: #5f6b7a;
}
.sc-shipping-price {
  font-weight: 600;
  font-size: 1rem;
}
.sc-free {
  color: #4a7c59;
  font-weight: 600;
}

/* Payment */
.sc-payment-selected {
  border: 2px solid #1a1a1a;
  border-radius: 8px;
  overflow: hidden;
}
.sc-payment-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.25rem;
  background: #fbf7ec;
}
.sc-payment-radio {
  display: flex;
  align-items: center;
  gap: .75rem;
}
.sc-payment-radio label {
  cursor: pointer;
  font-size: 1rem;
}
.sc-payment-badge {
  background: #c9a961;
  color: #1a1a1a;
  padding: .25rem .75rem;
  border-radius: 12px;
  font-size: .75rem;
  font-weight: 600;
}
.sc-payment-body {
  padding: 1rem 1.25rem;
  background: #fff;
  font-size: .9rem;
  color: #5f6b7a;
  border-top: 1px solid #e8e1d1;
  line-height: 1.5;
}

/* Order Summary */
.sc-summary {
  position: sticky;
  top: 20px;
}
.sc-summary-inner {
  background: #fff;
  border: 1px solid #e8e1d1;
  border-radius: 8px;
  padding: 1.5rem;
}

/* Summary items */
.sc-summary-items {
  max-height: 360px;
  overflow-y: auto;
  margin-bottom: 1rem;
  padding-right: .25rem;
}
.sc-summary-items::-webkit-scrollbar {
  width: 6px;
}
.sc-summary-items::-webkit-scrollbar-thumb {
  background: #d8d2c4;
  border-radius: 3px;
}
.sc-summary-item {
  display: grid;
  grid-template-columns: 56px 1fr auto;
  gap: .85rem;
  padding: .75rem 0;
  border-bottom: 1px solid #f0ebe0;
  align-items: start;
  position: relative;
}
.sc-summary-item:last-child {
  border-bottom: none;
}
.sc-item-image {
  position: relative;
  width: 56px;
  height: 70px;
  border-radius: 6px;
  overflow: hidden;
  background: #f5f1e8;
  border: 1px solid #e8e1d1;
}
.sc-item-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sc-item-qty {
  position: absolute;
  top: -8px;
  right: -8px;
  background: #8b7355;
  color: #fff;
  min-width: 22px;
  height: 22px;
  border-radius: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .75rem;
  font-weight: 600;
  padding: 0 5px;
  border: 2px solid #fff;
}
.sc-item-unavailable {
  background: #c84b31;
}
.sc-item-details {
  min-width: 0;
}
.sc-item-name {
  font-size: .9rem;
  font-weight: 500;
  line-height: 1.35;
  margin-bottom: .2rem;
  color: #1a1a1a;
}
.sc-item-meta {
  font-size: .8rem;
  color: #5f6b7a;
}
.sc-item-price {
  font-weight: 600;
  font-size: .95rem;
  white-space: nowrap;
}

/* Discount */
.sc-discount {
  border-top: 1px solid #e8e1d1;
  border-bottom: 1px solid #e8e1d1;
  margin: 1rem 0;
  padding: .75rem 0;
}
.sc-discount-toggle {
  display: flex;
  align-items: center;
  gap: .5rem;
  cursor: pointer;
  color: #5f6b7a;
  font-size: .9rem;
  font-weight: 500;
  user-select: none;
  transition: color .15s;
}
.sc-discount-toggle:hover {
  color: #c9a961;
}
.sc-discount-toggle .sc-chevron {
  margin-left: auto;
  transition: transform .2s;
}
.sc-discount-form {
  margin-top: .75rem;
}
.sc-discount-input-wrap {
  display: flex;
  gap: .5rem;
}
.sc-discount-input-wrap input {
  flex: 1;
  padding: .75rem 1rem;
  border: 1px solid #d8d2c4;
  border-radius: 6px;
  font-size: .9rem;
  font-family: inherit;
}
.sc-discount-input-wrap input:focus {
  outline: none;
  border-color: #1a1a1a;
}
.sc-apply-btn {
  padding: .75rem 1.25rem;
  background: #fff;
  border: 1px solid #8b7355;
  color: #8b7355;
  border-radius: 6px;
  font-size: .85rem;
  font-weight: 500;
  cursor: pointer;
  transition: all .15s;
  font-family: inherit;
}
.sc-apply-btn:hover {
  background: #8b7355;
  color: #fff;
}

/* Totals */
.sc-totals {
  padding: .5rem 0;
}
.sc-total-row {
  display: flex;
  justify-content: space-between;
  padding: .5rem 0;
  font-size: .95rem;
  color: #1a1a1a;
}
.sc-discount-row {
  color: #4a7c59;
}
.sc-total-final {
  font-size: 1.15rem;
  font-weight: 700;
  padding-top: 1rem;
  margin-top: .5rem;
  border-top: 1px solid #e8e1d1;
}
.sc-currency {
  font-size: .8rem;
  font-weight: 500;
  color: #5f6b7a;
  margin-right: .25rem;
}

/* Complete button */
.sc-complete-btn {
  width: 100%;
  padding: 1.1rem;
  background: #c9a961;
  color: #1a1a1a;
  border: none;
  border-radius: 6px;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: .3px;
  cursor: pointer;
  margin-top: 1.25rem;
  transition: all .2s;
  font-family: inherit;
}
.sc-complete-btn:hover {
  background: #1a1a1a;
  color: #faf7f2;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
}

/* Trust badges */
.sc-trust {
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid #e8e1d1;
}
.sc-trust-item {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .8rem;
  color: #5f6b7a;
}

/* Mobile summary toggle */
.sc-mobile-summary-toggle {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: #fff;
  border-top: 1px solid #e8e1d1;
  padding: 1rem;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  z-index: 100;
  font-size: .9rem;
  font-weight: 500;
  color: #1a1a1a;
  box-shadow: 0 -2px 8px rgba(0,0,0,.05);
}

/* Responsive */
@media (max-width: 900px) {
  .sc-container {
    grid-template-columns: 1fr;
  }
  .sc-summary {
    position: fixed;
    bottom: 60px;
    left: 0;
    right: 0;
    background: #fff;
    border-top: 1px solid #e8e1d1;
    border-radius: 0;
    padding: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height .3s;
    z-index: 99;
    box-shadow: 0 -4px 12px rgba(0,0,0,.1);
  }
  .sc-summary.sc-summary-open {
    max-height: 70vh;
    overflow-y: auto;
  }
  .sc-summary-inner {
    border: none;
    border-radius: 0;
    padding: 1.5rem;
  }
  .sc-mobile-summary-toggle {
    display: flex;
  }
  .shopify-checkout {
    padding-bottom: 5rem;
  }
  .sc-row-2, .sc-row-3 {
    grid-template-columns: 1fr;
  }
  .sc-section-header {
    padding: 1rem 1.25rem;
  }
  .sc-section-body {
    padding: 1.25rem;
  }
  .sc-address-toggle {
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .sc-topbar-inner {
    padding: 0 1rem;
  }
  .sc-main {
    padding: 0 1rem;
  }
  .sc-logo-text {
    font-size: 1rem;
  }
}

/* ============ Order Thank You ============ */
.order-thank-you {
  text-align: center;
  padding: 2rem 1rem 2.5rem;
  background: linear-gradient(135deg, #fbf7ec 0%, #f5efe3 100%);
  border-radius: 12px;
  margin-bottom: 2rem;
  border: 1px solid #e8e1d1;
}
.thank-you-icon {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: #d6f0dd;
  color: #2d6a3e;
  font-size: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1rem;
  font-weight: 700;
}
.order-thank-you h1 {
  font-size: 2rem;
  margin-bottom: .5rem;
}
.order-number-display {
  font-size: 1.1rem;
  color: #8b7355;
  letter-spacing: 1px;
  font-weight: 500;
  margin-bottom: .5rem;
}

/* ============ Status Timeline ============ */
.order-status-card {
  background: #fff;
  padding: 1.75rem;
  border-radius: 8px;
  border: 1px solid #e8e1d1;
  margin-bottom: 1.5rem;
}
.status-current {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e8e1d1;
}
.status-label {
  font-size: .85rem;
  color: #5f6b7a;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.status-timeline {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  position: relative;
}
.timeline-step {
  flex: 1;
  text-align: center;
  position: relative;
  z-index: 2;
}
.timeline-dot {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #e8e1d1;
  border: 3px solid #fff;
  box-shadow: 0 0 0 2px #e8e1d1;
  margin: 0 auto .5rem;
  transition: all .3s;
}
.timeline-step.active .timeline-dot {
  background: #c9a961;
  box-shadow: 0 0 0 2px #c9a961;
}
.timeline-step.current .timeline-dot {
  background: #1a1a1a;
  box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 6px rgba(26,26,26,.15);
  transform: scale(1.1);
}
.timeline-label {
  font-size: .8rem;
  color: #8b7355;
  font-weight: 500;
}
.timeline-step.active .timeline-label {
  color: #1a1a1a;
  font-weight: 600;
}
.timeline-line {
  flex: 1;
  height: 3px;
  background: #e8e1d1;
  margin-top: 14px;
  transition: background .3s;
}
.timeline-line.active {
  background: #c9a961;
}

/* ============ Guest CTA ============ */
.guest-cta {
  background: linear-gradient(135deg, #1a1a1a 0%, #3a3026 100%);
  color: #faf7f2;
  padding: 2rem;
  border-radius: 8px;
  margin-bottom: 1.5rem;
  text-align: center;
}
.guest-cta h3 {
  color: #c9a961;
  margin-bottom: .5rem;
}
.guest-cta p {
  color: #d8d2c4;
  margin-bottom: 1.25rem;
}
.guest-cta-actions {
  display: flex;
  gap: .75rem;
  justify-content: center;
  flex-wrap: wrap;
}
.guest-cta .btn-primary {
  background: #c9a961;
  color: #1a1a1a;
  border-color: #c9a961;
}
.guest-cta .btn-primary:hover {
  background: #faf7f2;
}
.guest-cta .btn-outline {
  color: #faf7f2;
  border-color: #faf7f2;
}
.guest-cta .btn-outline:hover {
  background: #faf7f2;
  color: #1a1a1a;
}

/* ============ Order Detail Grid ============ */
.order-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.order-detail-box {
  background: #fff;
  padding: 1.25rem;
  border-radius: 8px;
  border: 1px solid #e8e1d1;
}
.order-detail-box h3 {
  font-size: 1rem;
  margin-bottom: .75rem;
  color: #8b7355;
}
.order-detail-box p {
  font-size: .9rem;
  line-height: 1.6;
  margin: 0;
}

/* ============ Payment Action Box ============ */
.payment-action-box {
  background: #fbf7ec;
  border: 2px dashed #c9a961;
  padding: 1.75rem;
  border-radius: 8px;
  margin-bottom: 1.5rem;
  text-align: center;
}
.payment-action-box h3 {
  margin-bottom: .75rem;
}
.payment-account {
  background: #fff;
  padding: 1rem;
  border-radius: 6px;
  margin: 1rem 0;
  display: inline-block;
  text-align: left;
}
.payment-account .label {
  color: #8b7355;
  font-size: .85rem;
  display: inline-block;
  min-width: 70px;
}

/* ============ Order Items List ============ */
.order-items-list {
  background: #fff;
  border: 1px solid #e8e1d1;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 1rem;
}
.order-item-card {
  display: grid;
  grid-template-columns: 80px 1fr auto;
  gap: 1rem;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid #e8e1d1;
  align-items: center;
}
.order-item-card:last-child {
  border-bottom: none;
}
.order-item-img {
  width: 80px;
  height: 100px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid #e8e1d1;
}
.order-item-img-placeholder {
  width: 80px;
  height: 100px;
  background: #f5f1e8;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
}
.order-item-info {
  min-width: 0;
}
.order-item-name {
  font-weight: 600;
  font-size: 1rem;
  margin-bottom: .3rem;
}
.order-item-meta {
  font-size: .85rem;
  color: #5f6b7a;
  margin-bottom: .25rem;
}
.order-item-qty {
  font-size: .85rem;
  color: #8b7355;
}
.order-item-price {
  font-weight: 600;
  font-size: 1rem;
  white-space: nowrap;
}

/* ============ Order Totals Box ============ */
.order-totals-box {
  background: #fff;
  padding: 1.5rem;
  border-radius: 8px;
  border: 1px solid #e8e1d1;
  max-width: 450px;
  margin-left: auto;
  margin-bottom: 1.5rem;
}

/* ============ Order Actions ============ */
.order-actions {
  display: flex;
  gap: .75rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 2rem;
}

/* ============ Track Order Card ============ */
.track-order-card {
  max-width: 500px;
  margin: 2rem auto;
  background: #fff;
  padding: 2.5rem;
  border-radius: 8px;
  border: 1px solid #e8e1d1;
  text-align: center;
}
.track-icon {
  font-size: 3rem;
  margin-bottom: 1rem;
}
.track-order-card h1 {
  margin-bottom: .5rem;
}
.track-form {
  margin: 1.5rem 0;
  text-align: left;
}
.track-help {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e8e1d1;
}
.track-help a {
  color: #c9a961;
  font-weight: 500;
}

/* Responsive */
@media (max-width: 720px) {
  .order-detail-grid {
    grid-template-columns: 1fr;
  }
  .status-timeline {
    flex-wrap: wrap;
    gap: .5rem;
  }
  .timeline-line {
    display: none;
  }
  .timeline-step {
    flex: 0 0 calc(50% - .25rem);
  }
  .order-item-card {
    grid-template-columns: 60px 1fr;
  }
  .order-item-img, .order-item-img-placeholder {
    width: 60px;
    height: 75px;
  }
  .order-item-price {
    grid-column: 2;
    text-align: left;
  }
  .track-order-card {
    padding: 1.5rem;
  }
}
.whatsapp-order-section {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e8e1d1;
  text-align: center;
}
.btn-whatsapp {
  display: inline-flex;
  align-items: center;
  padding: .85rem 1.5rem;
  background: #25D366;
  color: #fff;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
  transition: all .2s;
  border: 2px solid #25D366;
}
.btn-whatsapp:hover {
  background: #128C7E;
  border-color: #128C7E;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4);
}

.product-features {
  margin-top: 2rem;
  padding: 2rem;
  background: linear-gradient(135deg, #fbf7ec 0%, #f5efe3 100%);
  border-radius: 8px;
  border: 1px solid #e8e1d1;
}
.features-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
}
.feature-box {
  background: #fff;
  padding: 1.25rem;
  border-radius: 8px;
  text-align: left;
  border: 1px solid #e8e1d1;
  transition: transform .2s, box-shadow .2s;
}
.feature-box:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
}
.feature-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #4A90E2;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: .75rem;
}
.feature-box h4 {
  font-size: .95rem;
  font-weight: 600;
  margin-bottom: .5rem;
  color: #1a1a1a;
}
.feature-box p {
  font-size: .85rem;
  color: #5f6b7a;
  line-height: 1.5;
  margin: 0;
}
@media (max-width: 900px) {
  .features-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 480px) {
  .features-grid {
    grid-template-columns: 1fr;
  }
  .product-features {
    padding: 1.5rem;
  }
}

/* ============ WhatsApp Order Button (Fixed Spacing) ============ */
.whatsapp-order-section {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e8e1d1;
  text-align: center;
}
.whatsapp-label {
  font-size: .9rem;
  color: #5f6b7a;
  margin-bottom: 1rem;
  font-style: italic;
}
.btn-whatsapp {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1rem 2rem;
  background: #25D366;
  color: #fff;
  border-radius: 6px;
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 1px;
  text-decoration: none;
  transition: all .2s;
  border: none;
  width: 100%;
  max-width: 320px;
}
.btn-whatsapp:hover {
  background: #128C7E;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(37, 211, 102, 0.35);
}

/* ============ Product Description Section ============ */
.product-description-section {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e8e1d1;
}
.product-description-section p {
  margin-bottom: .5rem;
  font-size: .95rem;
  line-height: 1.6;
}
.product-description-section strong {
  color: #1a1a1a;
}

/* ============ Full-Width Features Section (Website Colors) ============ */
.product-features-full {
  margin-top: 4rem;
  padding: 3.5rem 0;
  background: linear-gradient(135deg, #faf7f2 0%, #f5efe3 100%);
  border-top: 1px solid #e8e1d1;
  border-bottom: 1px solid #e8e1d1;
}
.features-heading {
  text-align: center;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.8rem;
  font-weight: 600;
  color: #1a1a1a;
  margin-bottom: 2rem;
  letter-spacing: 1px;
}
.features-grid-full {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}
.feature-card {
  background: #fff;
  padding: 1.75rem 1.25rem;
  border-radius: 8px;
  text-align: center;
  border: 1px solid #e8e1d1;
  transition: transform .25s, box-shadow .25s;
}
.feature-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
  border-color: #c9a961;
}
.feature-check {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #c9a961;
  color: #1a1a1a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  font-weight: 700;
  margin: 0 auto 1rem;
  box-shadow: 0 2px 8px rgba(201, 169, 97, 0.3);
}
.feature-card h4 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem;
  font-weight: 600;
  color: #1a1a1a;
  margin-bottom: .75rem;
  letter-spacing: .5px;
}
.feature-card p {
  font-size: .85rem;
  color: #5f6b7a;
  line-height: 1.6;
  margin: 0;
}

/* Responsive */
@media (max-width: 900px) {
  .features-grid-full {
    grid-template-columns: repeat(2, 1fr);
  }
  .product-features-full {
    padding: 2.5rem 0;
  }
}
@media (max-width: 480px) {
  .features-grid-full {
    grid-template-columns: 1fr;
  }
  .btn-whatsapp {
    font-size: .9rem;
    padding: .9rem 1.5rem;
  }
}

/* ============ Admin Image URL Manager ============ */
.image-url-row {
  display: flex;
  gap: .75rem;
  margin-bottom: .75rem;
  align-items: center;
  background: #fff;
  padding: .5rem;
  border-radius: 6px;
  border: 1px solid #e8e1d1;
}
.image-url-row input {
  flex: 1;
  margin-bottom: 0;
}
.img-preview {
  width: 50px;
  height: 50px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid #e8e1d1;
}

/* ============ Admin Features Section ============ */
.features-admin-section {
  margin-top: 2rem;
  padding: 1.5rem;
  background: #fbf7ec;
  border-radius: 6px;
  border: 1px solid #e8e1d1;
}
.feature-admin-row {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 1rem;
  margin-bottom: 1rem;
}
.feature-admin-row input {
  margin-bottom: 0;
}
.feature-admin-row input:first-child {
  font-weight: 600;
}

@media (max-width: 720px) {
  .feature-admin-row {
    grid-template-columns: 1fr;
  }
}

/* Payment Status Styling */
.order-detail-box .text-warn {
  color: #b8860b;
  font-weight: 500;
  font-size: 0.9rem;
}
.order-detail-box .text-ok {
  color: #4a7c59;
  font-weight: 600;
  font-size: 0.9rem;
}
.order-detail-box .btn-link.small {
  font-size: 0.85rem;
  color: #c9a961;
  text-decoration: none;
  border-bottom: 1px dotted #c9a961;
}
.order-detail-box .btn-link.small:hover {
  color: #1a1a1a;
  border-color: #1a1a1a;
}