:root {
  --black: #070707;
  --panel: #11100e;
  --panel-light: #181612;
  --gold: #d4af37;
  --gold-light: #f3dfc2;
  --white: #fffaf1;
  --muted: #d0c7b9;
  --border: rgba(212, 175, 55, 0.38);
  --danger: #e57b7b;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: radial-gradient(circle at top, #211806 0%, #080706 38%, #000 100%); color: var(--white); font-family: "Poppins", sans-serif; min-height: 100vh; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }

.store-header { position: sticky; top: 0; z-index: 20; min-height: 82px; padding: 8px clamp(20px, 6vw, 90px); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; background: rgba(0, 0, 0, 0.92); border-bottom: 1px solid var(--border); backdrop-filter: blur(14px); }
.store-logo img { width: 68px; height: 62px; object-fit: contain; }
.store-header nav { justify-self: end; display: flex; align-items: center; gap: clamp(16px, 3vw, 38px); }
.store-header nav a { color: var(--gold-light); font-size: 0.92rem; transition: color .2s; }
.store-header nav a:hover { color: var(--gold); }
.cart-link span { display: inline-grid; place-items: center; min-width: 23px; height: 23px; margin-left: 4px; border-radius: 50%; background: var(--gold); color: #000; font-weight: 700; }
.wishlist-nav span { color: var(--gold); font-weight: 600; }
.menu-toggle { justify-self: start; display: grid; width: 54px; padding: 6px 7px; color: var(--gold-light); background: transparent; border: 0; cursor: pointer; }
.menu-toggle i { display: block; width: 29px; height: 2px; margin: 3px auto; background: var(--gold-light); }
.menu-toggle span, .header-search small { margin-top: 4px; color: var(--muted); font-size: .58rem; letter-spacing: .08em; text-transform: uppercase; }
.header-search { display: grid; place-items: center; font-size: 2rem !important; line-height: .8; }
.drawer-backdrop { position: fixed; inset: 0; z-index: 49; background: rgba(0,0,0,.72); opacity: 0; transition: opacity .25s; }
.drawer-backdrop.open { opacity: 1; }
.menu-drawer, .filter-drawer { position: fixed; top: 0; bottom: 0; left: 0; z-index: 50; width: min(430px, 88vw); padding: 38px 28px; overflow-y: auto; color: var(--white); background: #0e0d0b; border-right: 1px solid var(--border); box-shadow: 20px 0 60px rgba(0,0,0,.5); transform: translateX(-105%); transition: transform .28s ease; }
.menu-drawer.open, .filter-drawer.open { transform: translateX(0); }
.menu-drawer h2, .filter-drawer h2 { margin: 0 0 22px; color: var(--gold-light); font-size: 2.4rem; }
.menu-drawer > a { display: block; padding: 16px 2px; border-bottom: 1px solid var(--border); color: var(--gold-light); }
.drawer-close { width: 42px; height: 42px; padding: 0; color: var(--gold-light); background: transparent; border: 1px solid var(--border); border-radius: 50%; font-size: 1.8rem; cursor: pointer; }
.menu-drawer > .drawer-close { float: right; }.drawer-open { overflow: hidden; }

.store-main { width: min(1180px, 92%); margin: 0 auto; min-height: calc(100vh - 160px); padding: 55px 0 80px; }
.store-hero, .page-heading { text-align: center; max-width: 760px; margin: 0 auto 38px; }
.eyebrow { margin: 0 0 8px; color: var(--gold); letter-spacing: .22em; font-size: .76rem; font-weight: 600; }
h1, h2 { font-family: "Cormorant Garamond", serif; }
.store-hero h1, .page-heading h1, .success-card h1, .login-card h1 { margin: 0 0 12px; color: var(--gold-light); font-size: clamp(2.2rem, 5vw, 4.2rem); line-height: 1; }
.store-hero > p:last-child, .page-heading p:last-child { color: var(--muted); }

.category-filters { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-bottom: 34px; }
.category-filters a { padding: 9px 18px; border: 1px solid var(--border); border-radius: 999px; color: var(--muted); }
.category-filters a.active, .category-filters a:hover { background: var(--gold); color: #080706; border-color: var(--gold); }
.compact-hero { margin-bottom: 24px; }
.catalogue-form { display: grid; gap: 18px; }
.catalogue-form label span { display: block; margin-bottom: 7px; color: var(--gold-light); font-size: .76rem; letter-spacing: .05em; }
.catalogue-form input, .catalogue-form select, .product-admin-table input, .product-admin-table select { width: 100%; min-height: 42px; padding: 9px 10px; color: var(--white); background: #080706; border: 1px solid var(--border); border-radius: 7px; }
.clear-filters { padding: 12px; color: var(--gold-light); font-size: .8rem; text-align: center; border: 1px solid var(--border); border-radius: 8px; }
.catalogue-meta { display: flex; justify-content: space-between; align-items: center; margin: 15px 2px 20px; color: var(--muted); }
.wishlist-filter { padding: 9px 13px; color: var(--gold-light); background: transparent; border: 1px solid var(--border); border-radius: 999px; cursor: pointer; }
.wishlist-filter.active { color: #080706; background: var(--gold); }
.filter-row { margin-bottom: 25px; padding: 13px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.filter-open { display: inline-flex; align-items: center; gap: 10px; padding: 8px 2px; color: var(--gold-light); background: transparent; border: 0; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.filter-icon { font-size: 1.5rem; transform: rotate(180deg); }
.drawer-title { display: flex; justify-content: space-between; align-items: flex-start; border-bottom: 1px solid var(--border); margin-bottom: 24px; }
.filter-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 6px; }

.product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }
.product-card { overflow: hidden; border: 1px solid rgba(212,175,55,.48); border-radius: 18px; background: linear-gradient(145deg, rgba(29, 25, 18, .96), rgba(8, 8, 8, .98)); box-shadow: 0 18px 55px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,235,178,.025); transition: transform .25s, border-color .25s, box-shadow .25s; }
.product-card:hover { transform: translateY(-6px); border-color: rgba(238,202,104,.85); box-shadow: 0 22px 60px rgba(0,0,0,.42), 0 0 20px rgba(212,175,55,.12); }
.product-image { position: relative; height: 320px; overflow: hidden; background: #0b0a08; }
.product-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s; }
.product-image-link { display: block; width: 100%; height: 100%; }
.product-size { margin: -2px 0 7px; color: var(--gold-light); font-size: .78rem; }
.product-card:hover img { transform: scale(1.04); }
.badge { position: absolute; top: 14px; right: 14px; padding: 7px 11px; border-radius: 999px; background: var(--gold); color: #090806; font-size: .7rem; font-weight: 600; }
.badge.new-arrival { color: #f8dc8a; border: 1px solid rgba(212,175,55,.85); background: rgba(5,5,5,.86); letter-spacing: .06em; text-transform: uppercase; box-shadow: 0 0 16px rgba(212,175,55,.3); }
.badge.best-seller { color: #100b02; background: linear-gradient(135deg,#f4db7b,#b98614); text-transform: uppercase; }
.wishlist-button { position: absolute; top: 12px; left: 12px; z-index: 2; width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; color: #fff; background: rgba(0,0,0,.65); font-size: 1.5rem; cursor: pointer; }
.wishlist-button.active { color: var(--gold); }
.stock-label { position: absolute; right: 13px; bottom: 13px; padding: 8px 12px; border-radius: 4px; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.stock-label.sold-out { color: #fff; background: #777; }
.stock-label.coming-soon { color: #f7d77d; border: 1px solid #d4af37; background: rgba(5,5,5,.88); box-shadow: 0 0 18px rgba(212,175,55,.25); }
.product-info { padding: 21px; }
.product-category { color: var(--gold); font-size: .72rem; letter-spacing: .15em; text-transform: uppercase; }
.product-info h2 { margin: 4px 0 8px; font-size: 1.9rem; }
.product-description { min-height: 52px; color: #ddd5c9; font-size: .88rem; line-height: 1.65; }
.stock-note { margin: 8px 0 0; font-size: .72rem; }
.stock-note.available { color: #9ae6b4; }.stock-note.unavailable { color: var(--muted); }
.product-bottom { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 18px; }
.product-bottom strong { color: var(--gold-light); }
.offer-price { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 9px; }
.offer-price del { color: #9d9488; font-size: .82rem; text-decoration-thickness: 2px; }
.offer-price strong { width: 100%; color: var(--gold-light); font-size: 1.08rem; }
.discount-pill { padding: 4px 8px; border-radius: 999px; color: #1a1000; background: linear-gradient(135deg,#f4db7b,#b98614); font-size: .68rem; font-weight: 800; letter-spacing: .04em; }
.product-bottom button, .status-form button { border: 0; padding: 10px 14px; border-radius: 8px; background: var(--gold); color: #080706; font-weight: 600; cursor: pointer; }
.product-bottom button:disabled { color: #c8c1b7; background: #555; cursor: not-allowed; }

.product-detail { display: grid; grid-template-columns: minmax(360px,.82fr) minmax(380px,1.18fr); gap: clamp(28px,5vw,70px); align-items: start; }
.product-detail-media { position: sticky; top: 105px; width: 100%; max-width: 510px; margin-inline: auto; }
.product-detail-hero { position: relative; overflow: hidden; border: 1px solid var(--border); border-radius: 18px; background: #0b0a08; }
.product-detail-hero img { display: block; width: 100%; height: min(620px,72vh); object-fit: cover; }
.gallery-arrow { position: absolute; top: 50%; z-index: 3; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid rgba(255,255,255,.45); border-radius: 50%; color: #fff; background: rgba(0,0,0,.58); font-size: 2rem; line-height: 1; cursor: pointer; transform: translateY(-50%); }
.gallery-prev { left: 12px; }.gallery-next { right: 12px; }
.product-thumbnails { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin-top: 12px; }
.product-thumbnails button { padding: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 10px; background: #111; cursor: pointer; }
.product-thumbnails button.active { border-color: var(--gold); }
.product-thumbnails img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
.product-detail-copy h1 { margin: 7px 0 8px; color: var(--gold-light); font-size: clamp(2.7rem,5vw,4.8rem); line-height: .96; }
.detail-price { margin: 18px 0 8px; color: var(--gold); font-size: 1.35rem; font-weight: 600; }
.detail-price.offer-price { max-width: 360px; gap: 8px 12px; }
.detail-price.offer-price del { font-size: 1rem; }
.detail-price.offer-price strong { width: 100%; color: var(--gold); font-size: 1.55rem; }
.detail-size { color: var(--gold-light); font-size: .86rem; }
.lasting-badge { display: inline-flex; margin: 8px 0 0; padding: 7px 12px; border: 1px solid rgba(212,175,55,.45); border-radius: 999px; color: #f4dc96; background: rgba(212,175,55,.08); font-size: .76rem; font-weight: 600; letter-spacing: .04em; }
.detail-intro { color: var(--muted); line-height: 1.85; }
.detail-panel { margin-top: 24px; padding: 22px; border: 1px solid var(--border); border-radius: 14px; background: rgba(17,16,14,.9); }
.detail-panel h2 { margin: 0 0 13px; color: var(--gold-light); font-size: 1.55rem; }
.note-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.note-grid div { padding: 13px 10px; text-align: center; border-radius: 9px; background: #080706; }
.note-grid small { display: block; color: var(--gold); text-transform: uppercase; letter-spacing: .08em; }
.note-grid span { display: block; margin-top: 5px; color: var(--muted); font-size: .8rem; }
.detail-actions { display: grid; grid-template-columns: 90px 1fr 1fr; gap: 10px; margin-top: 24px; }
.detail-actions input { width: 100%; padding: 12px; color: #fff; background: #080706; border: 1px solid var(--border); border-radius: 8px; }
.detail-actions button { width: 100%; }
.detail-coming { margin-top: 22px; padding: 15px; color: var(--gold-light); border: 1px solid var(--border); border-radius: 10px; }
.stock-summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 13px; }
.low-stock-note { margin: 0; padding: 7px 11px; border-radius: 999px; color: #ffd88a; background: rgba(173,77,20,.22); border: 1px solid rgba(255,180,80,.35); font-size: .73rem; font-weight: 600; }

.gold-button, .outline-button { display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 8px; padding: 13px 22px; cursor: pointer; font-weight: 600; }
.gold-button { background: linear-gradient(135deg, #f0d478, #b88b19); color: #080706; }
.outline-button { border: 1px solid var(--gold); background: transparent; color: var(--gold-light); }
.empty-state, .success-card, .login-card { max-width: 620px; margin: 40px auto; padding: 44px; text-align: center; border: 1px solid var(--border); border-radius: 20px; background: var(--panel); }
.empty-state p, .success-card > p { color: var(--muted); }

.cart-layout, .checkout-layout { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(280px, .8fr); gap: 28px; align-items: start; }
.cart-items, .checkout-form, .order-summary { border: 1px solid var(--border); border-radius: 16px; background: rgba(17,16,14,.94); padding: 24px; }
.cart-item { display: grid; grid-template-columns: 95px 1fr 95px 120px; gap: 18px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--border); }
.cart-item img { width: 95px; height: 95px; object-fit: cover; border-radius: 10px; }
.cart-item p { margin: 0; color: var(--gold); font-size: .72rem; text-transform: uppercase; }
.cart-item h2 { margin: 3px 0 8px; font-size: 1.45rem; }
.cart-item label { color: var(--muted); font-size: .72rem; }
.cart-item input { width: 70px; display: block; margin-top: 5px; padding: 8px; color: #fff; background: #050505; border: 1px solid var(--border); border-radius: 6px; }
.cart-items > button { margin-top: 20px; }
.order-summary { position: sticky; top: 105px; }
.order-summary h2, .checkout-form h2 { margin-top: 0; font-size: 1.8rem; color: var(--gold-light); }
.order-summary p { display: flex; justify-content: space-between; gap: 15px; padding: 12px 0; margin: 0; color: var(--muted); border-bottom: 1px solid var(--border); font-size: .88rem; }
.order-summary p strong { color: var(--white); text-align: right; }
.order-summary .summary-total { padding: 18px 0; font-size: 1.05rem; }
.order-summary .summary-total strong { color: var(--gold); }
.order-summary .gold-button { width: 100%; margin-top: 20px; }
.order-summary small { display: block; margin-top: 12px; color: var(--muted); text-align: center; }

.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form-grid label, .login-card label { display: block; text-align: left; color: var(--gold-light); font-size: .82rem; }
.form-grid input, .form-grid textarea, .login-card input { width: 100%; margin-top: 7px; padding: 12px 13px; color: #fff; background: #080706; border: 1px solid var(--border); border-radius: 8px; outline: none; }
.form-grid input:focus, .form-grid textarea:focus, .login-card input:focus { border-color: var(--gold); }
.form-grid textarea { min-height: 95px; resize: vertical; }
.full-width { grid-column: 1 / -1; }
.payment-box { display: flex; gap: 13px; align-items: center; margin: 22px 0; padding: 16px; border: 1px solid var(--gold); border-radius: 10px; background: rgba(212,175,55,.07); }
.payment-box > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--gold); color: #000; }
.payment-box p { margin: 3px 0 0; color: var(--muted); font-size: .8rem; }
.checkout-form > .gold-button { width: 100%; }
.alert { max-width: 700px; margin: 0 auto 20px; padding: 14px 18px; border-radius: 8px; }
.alert.error { border: 1px solid rgba(229,123,123,.5); background: rgba(229,123,123,.08); color: #ffd1d1; }
.alert ul { margin: 0; }

.success-icon { display: grid; place-items: center; width: 75px; height: 75px; margin: 0 auto 20px; border-radius: 50%; background: var(--gold); color: #000; font-size: 2rem; font-weight: 700; }
.order-number { display: flex; justify-content: space-between; margin: 12px 0; padding: 13px; border-radius: 8px; background: #080706; color: var(--muted); }
.order-number strong { color: var(--gold-light); }
.success-card .gold-button { margin-top: 20px; }

.login-card { max-width: 470px; }
.login-card form { display: grid; gap: 17px; margin: 25px 0 18px; }
.login-card small { color: var(--muted); }
.admin-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 28px; }
.admin-heading h1 { margin: 0; font-size: 2.8rem; color: var(--gold-light); }
.admin-heading p:last-child { color: var(--muted); }
.admin-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.alert.success { border: 1px solid rgba(94,177,120,.45); background: rgba(94,177,120,.12); color: #b7f2c9; }
.table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 14px; background: var(--panel); }
table { width: 100%; border-collapse: collapse; min-width: 1000px; }
th, td { padding: 15px; text-align: left; border-bottom: 1px solid var(--border); font-size: .82rem; }
th { color: var(--gold); background: #0a0908; text-transform: uppercase; letter-spacing: .06em; }
td small { display: block; color: var(--muted); margin-top: 5px; }
.status { padding: 5px 9px; border-radius: 999px; background: rgba(212,175,55,.12); color: var(--gold-light); }
.status.delivered { background: rgba(94,177,120,.15); color: #9ae6b4; }
.status.cancelled { background: rgba(229,123,123,.14); color: #ffb0b0; }
.status-form { display: flex; gap: 7px; }
.status-form select { padding: 7px; color: #fff; border: 1px solid var(--border); border-radius: 6px; background: #080706; }
.product-admin-table button { padding: 9px 14px; border: 0; border-radius: 7px; color: #080706; background: var(--gold); font-weight: 600; cursor: pointer; }
.product-admin-table .stock-input { width: 82px; }.feature-check { white-space: nowrap; }

.store-footer { padding: 42px clamp(20px,6vw,90px) 20px; display: grid; grid-template-columns: 1.3fr repeat(3,1fr); gap: 32px; border-top: 1px solid var(--border); background: #030303; color: var(--muted); font-size: .8rem; }
.store-footer h3 { margin: 0 0 14px; color: var(--gold-light); font-family: "Cormorant Garamond",serif; font-size: 1.25rem; }
.store-footer a, .store-footer span { display: block; margin: 9px 0; color: var(--muted); }.store-footer a:hover { color: var(--gold); }
.footer-brand img { width: 76px; height: 76px; object-fit: contain; }.footer-brand p { color: var(--gold); letter-spacing: .08em; }
.footer-copy { grid-column: 1 / -1; padding-top: 18px; margin: 0; text-align: center; border-top: 1px solid var(--border); }
.whatsapp-float { position: fixed; right: 22px; bottom: 22px; z-index: 35; display: flex; align-items: center; gap: 9px; padding: 10px 15px 10px 10px; color: #fff; background: #20b85a; border-radius: 999px; box-shadow: 0 10px 30px rgba(0,0,0,.45); }
.whatsapp-float span { display: grid; place-items: center; width: 34px; height: 34px; color: #20b85a; background: #fff; border-radius: 50%; font-size: 1.15rem; }.whatsapp-float b { font-size: .78rem; }
.legal-page { max-width: 860px; margin: 0 auto; }.legal-page > h1 { margin: 0; color: var(--gold-light); font-size: clamp(2.7rem,6vw,4.5rem); }.legal-updated { color: var(--muted); }
.legal-card { margin-top: 28px; padding: clamp(22px,4vw,42px); border: 1px solid var(--border); border-radius: 18px; background: var(--panel); }.legal-card h2 { margin: 28px 0 7px; color: var(--gold-light); font-size: 1.55rem; }.legal-card h2:first-child { margin-top: 0; }.legal-card p { color: var(--muted); line-height: 1.8; }.legal-card a { color: var(--gold); }

@media (max-width: 900px) {
  .store-footer { grid-template-columns: 1fr 1fr; }.footer-copy { grid-column: 1 / -1; }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .cart-layout, .checkout-layout { grid-template-columns: 1fr; }
  .order-summary { position: static; }
  .cart-item { grid-template-columns: 82px 1fr 85px; }
  .cart-item > span { grid-column: 2 / -1; }
  .product-detail { grid-template-columns: 1fr; }.product-detail-media { position: static; max-width: 580px; }
}

@media (max-width: 600px) {
  .store-header { padding: 8px 16px; }
  .store-logo img { width: 54px; height: 54px; }
  .store-header nav { gap: 12px; }
  .store-header nav a { font-size: .76rem; }
  .store-main { width: 92%; padding-top: 35px; }
  .store-header { grid-template-columns: 60px 1fr 105px; padding: 7px 12px; }
  .store-logo { justify-self: center; }.store-logo img { width: 58px; }
  .store-header nav { gap: 12px; }
  .header-search { font-size: 1.6rem !important; }
  .menu-toggle { width: 50px; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .product-image { height: 190px; }
  .product-info { padding: 12px; }
  .product-info h2 { font-size: 1.25rem; }
  .product-description { display: none; }
  .product-size { font-size: .68rem; }
  .product-bottom { display: block; margin-top: 10px; }
  .product-bottom strong { display: block; margin-bottom: 9px; font-size: .82rem; }
  .product-bottom button { width: 100%; padding: 9px 5px; font-size: .72rem; }
  .badge, .stock-label { right: 7px; bottom: 7px; top: auto; padding: 6px 7px; font-size: .58rem; }
  .wishlist-button { top: 7px; left: 7px; width: 34px; height: 34px; }
  .catalogue-meta { font-size: .8rem; }
  .admin-heading { align-items: flex-start; gap: 18px; flex-direction: column; }
  .cart-item { grid-template-columns: 72px 1fr; }
  .cart-item img { width: 72px; height: 72px; }
  .cart-item label, .cart-item > span { grid-column: 2; }
  .form-grid { grid-template-columns: 1fr; }
  .full-width { grid-column: auto; }
  .checkout-form, .order-summary, .cart-items { padding: 18px; }
  .empty-state, .success-card, .login-card { padding: 30px 18px; }
  .store-footer { grid-template-columns: 1fr; gap: 24px; text-align: center; }.footer-copy { grid-column: auto; }.footer-brand img { margin: auto; }
  .whatsapp-float { right: 14px; bottom: 14px; }.whatsapp-float b { display: none; }
  .detail-actions { grid-template-columns: 72px 1fr; }.detail-actions .buy-now-form { grid-column: 1/-1; }.note-grid { grid-template-columns: 1fr; }
  .product-detail-hero img { height: min(560px,68vh); }.stock-summary { align-items: flex-start; flex-direction: column; }
}