:root {
  --black:#070706; --surface:#10100e; --line:rgba(222,192,123,.23);
  --gold:#caa75d; --gold-light:#f4dc9b; --cream:#f6efe1; --muted:#b8ae9b; --danger:#d67070;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--black); color:var(--cream); font:16px/1.65 "Noto Sans Arabic",Tahoma,sans-serif; }
body::before { content:""; position:fixed; inset:0; z-index:-1; background:radial-gradient(circle at 90% 0,rgba(202,167,93,.14),transparent 26rem),radial-gradient(circle at 0 72%,rgba(202,167,93,.06),transparent 30rem); }
button,input,textarea,select { font:inherit; }
.catalog-shell { width:min(1200px,calc(100% - 3rem)); margin:auto; padding:1.25rem 0 2.5rem; }
.topbar { position:relative; min-height:3.35rem; padding:.75rem 0 1.5rem; border-bottom:1px solid var(--line); }
.language-switcher { position:absolute; top:.75rem; left:0; display:flex; direction:rtl; overflow:hidden; border:1px solid var(--line); border-radius:999px; background:rgba(8,8,7,.72); }
.language { min-width:3rem; border:0; border-inline-end:1px solid var(--line); padding:.75rem; background:transparent; color:var(--muted); font-size:.72rem; font-weight:700; cursor:pointer; }
.language:last-child { border:0; }
.language:hover,.language:focus-visible { color:var(--gold-light); outline:0; }
.language.is-active { background:var(--gold-light); color:#18130a; }
.mobile-brand { display:none; }
.eyebrow { margin:0; color:var(--gold); font-size:.76rem; font-weight:700; letter-spacing:.13em; }
.intro { max-width:46rem; padding:clamp(3.5rem,8vw,6.5rem) 0 2.5rem; }
h1,h2 { margin:0; font-weight:600; }
h1 { margin-top:.75rem; font-size:clamp(2.25rem,6vw,4.8rem); line-height:1.18; letter-spacing:-.045em; }
.intro-copy { max-width:39rem; margin:1rem 0 0; color:var(--muted); font-size:1.05rem; }
.filter-area { position:relative; }
.filters { display:flex; flex-wrap:wrap; gap:.65rem; padding:1.35rem 0 2rem; border-top:1px solid var(--line); }
.audience-filters,.accessory-filters,.brand-filters { position:absolute; z-index:5; display:flex; flex-direction:column; min-width:9rem; padding:.45rem; border:1px solid var(--line); border-radius:.75rem; background:#11110f; box-shadow:0 .8rem 2rem rgba(0,0,0,.38); }
.audience-filters.is-hidden,.accessory-filters.is-hidden,.brand-filters.is-hidden { display:none; }
.filter,.audience-filter,.accessory-filter,.brand-filter { border:1px solid var(--line); border-radius:999px; padding:.65rem 1rem; background:transparent; color:var(--cream); font-weight:600; cursor:pointer; }
.filter:hover,.filter:focus-visible,.audience-filter:hover,.audience-filter:focus-visible,.accessory-filter:hover,.accessory-filter:focus-visible,.brand-filter:hover,.brand-filter:focus-visible { border-color:var(--gold); outline:0; }
.filter.is-active,.audience-filter.is-active,.accessory-filter.is-active,.brand-filter.is-active { background:var(--gold-light); color:#21180a; border-color:var(--gold-light); }
.filter.with-dropdown::after { content:'⌄'; display:inline-block; margin-inline-start:.42rem; font-size:1rem; line-height:0; }
.audience-filter,.accessory-filter,.brand-filter { width:100%; border:0; border-radius:.4rem; text-align:start; }
.product-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2rem; }
.product-card { overflow:hidden; border:1px solid var(--line); background:rgba(16,16,14,.72); }
.product-card.is-hidden { display:none; }
.image-wrap { position:relative; aspect-ratio:1/.77; overflow:hidden; background:#12110f; }
.product-image-button { display:block; width:100%; height:100%; padding:0; border:0; background:none; cursor:zoom-in; }
.image-wrap img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.product-card:hover img { transform:scale(1.035); }
.category-label { position:absolute; top:1.15rem; right:1.15rem; border:1px solid rgba(244,220,155,.58); border-radius:999px; padding:.35rem .75rem; background:rgba(8,8,7,.68); color:var(--gold-light); font-size:.77rem; font-weight:700; }
.card-copy { padding:1.2rem 1.25rem 1.4rem; }
.card-copy h2 { font-size:1.2rem; }
.card-copy p { margin:.35rem 0 0; color:var(--muted); font-size:.9rem; }
footer { display:flex; align-items:center; gap:.75rem; padding-top:3.5rem; color:var(--muted); font-family:"Playfair Display",serif; font-size:.88rem; letter-spacing:.05em; }
.footer-line { height:1px; flex:1; background:var(--line); }
.image-lightbox { position:relative; width:min(92vw,1100px); height:min(90svh,900px); max-width:92vw; max-height:90svh; padding:3.5rem 1rem 1rem; border:1px solid var(--line); border-radius:.8rem; background:#070706; color:var(--cream); }
.image-lightbox::backdrop { background:rgba(0,0,0,.86); }
.image-lightbox img { display:block; width:100%; height:100%; object-fit:contain; }
.lightbox-close { position:absolute; top:.7rem; right:.85rem; width:2.45rem; height:2.45rem; border:1px solid var(--line); border-radius:50%; background:#171611; color:var(--cream); font-size:1.7rem; line-height:1; cursor:pointer; }

/* Admin */
.admin-body { min-height:100vh; display:grid; place-items:center; padding:1.5rem; }
.install-card,.login-card { width:min(100%,32rem); padding:2rem; border:1px solid var(--line); background:#0d0d0b; box-shadow:0 1rem 4rem rgba(0,0,0,.3); }
.install-card h1,.login-card h1 { font-size:2rem; }
.install-card p { color:var(--muted); }
label { display:block; margin:1rem 0; color:var(--cream); font-weight:600; }
input,textarea,select { width:100%; margin-top:.35rem; border:1px solid var(--line); border-radius:.35rem; padding:.75rem; background:#151512; color:var(--cream); }
textarea { min-height:5rem; resize:vertical; }
.primary,.secondary,.danger { display:inline-block; border:0; border-radius:.35rem; padding:.72rem 1rem; text-decoration:none; font-weight:700; cursor:pointer; }
.primary { background:var(--gold-light); color:#21180a; }
.secondary { background:#24231e; color:var(--cream); }
.danger { background:#522426; color:#fff; }
.alert { padding:.75rem 1rem; border:1px solid var(--line); }
.alert.error { border-color:#9d4d51; color:#ffc7c7; }
.alert.success { border-color:#6e855f; color:#dff4cf; }
.admin-shell { width:min(1180px,calc(100% - 2rem)); margin:auto; padding:1.5rem 0 3rem; }
.admin-nav { display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; padding-bottom:1rem; border-bottom:1px solid var(--line); }
.admin-nav strong { margin-inline-end:auto; color:var(--gold-light); font-family:"Playfair Display",serif; letter-spacing:.08em; }
.admin-nav a { color:var(--cream); text-decoration:none; padding:.45rem .65rem; }
.admin-nav a:hover { color:var(--gold-light); }
.admin-page-head { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin:2rem 0 1rem; }
.admin-page-head h1 { font-size:2rem; }
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.stat,.panel { border:1px solid var(--line); background:#10100e; padding:1.25rem; }
.stat span { color:var(--muted); font-size:.9rem; }
.stat strong { display:block; margin-top:.4rem; color:var(--gold-light); font:2rem "Playfair Display",serif; }
.table-wrap { overflow:auto; border:1px solid var(--line); }
table { width:100%; border-collapse:collapse; text-align:right; }
th,td { padding:.8rem; border-bottom:1px solid var(--line); vertical-align:middle; }
th { color:var(--gold-light); font-size:.85rem; }
td img { width:4rem; height:3rem; object-fit:cover; }
.inline-form { display:inline; }
.form-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.form-grid .wide { grid-column:span 3; }
.preview-logo { display:block; max-width:12rem; max-height:10rem; margin:.75rem 0; border:1px solid var(--line); }
.muted { color:var(--muted); }
.audience-choice,.accessory-choice,.brand-choice { display:none; }
.audience-choice.is-visible,.accessory-choice.is-visible,.brand-choice.is-visible { display:block; }
.audience-choice label { display:inline-flex; align-items:center; gap:.45rem; margin:.35rem .75rem .35rem 0; }
.audience-choice input { width:auto; margin:0; }
.audience-choice-button { margin:.35rem .4rem; border:1px solid var(--line); border-radius:999px; padding:.55rem 1rem; background:transparent; color:var(--cream); font-weight:700; cursor:pointer; }
.audience-choice-button.is-active { background:var(--gold-light); color:#21180a; border-color:var(--gold-light); }

@media (max-width:620px) {
  .catalog-shell { width:min(100% - 2rem,1200px); }
  .topbar { width:100vw; min-height:100svh; margin-inline:calc(50% - 50vw); padding:0; border:0; background:#050505; }
  .mobile-brand { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; overflow:hidden; background:radial-gradient(circle at center,rgba(202,167,93,.12),transparent 38%),#050505; }
  .mobile-brand img { display:block; width:min(100%,36rem); height:auto; max-height:78svh; object-fit:contain; }
  .language-switcher { z-index:2; top:1rem; left:1rem; }
  .language { min-width:2.1rem; padding:.65rem .55rem; }
  .intro { padding-top:2.75rem; }
  .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
  .image-wrap { aspect-ratio:1/1; }
  .card-copy { padding:.75rem; }
  .card-copy h2 { font-size:.94rem; line-height:1.45; }
  .card-copy p { font-size:.76rem; line-height:1.55; }
  .category-label { top:.8rem; right:.8rem; padding:.25rem .5rem; font-size:.65rem; }
  .product-card:hover img { transform:none; }
  .admin-nav strong { width:100%; margin:0; }
  .stats,.form-grid { grid-template-columns:1fr; }
  .form-grid .wide { grid-column:span 1; }
  .admin-page-head { align-items:flex-start; flex-direction:column; }
}
@media (min-width:621px) and (max-width:980px) {
  .catalog-shell,.admin-shell { width:min(100% - 2.5rem,900px); }
  .intro { padding-top:4.5rem; }
  .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.25rem; }
  .form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .form-grid .wide { grid-column:span 2; }
  .image-lightbox { width:min(94vw,850px); height:90svh; max-width:94vw; max-height:90svh; }
}
@media (min-width:1100px) { .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .image-wrap { aspect-ratio:1/.82; } }
@media (max-width:420px) {
  .catalog-shell { width:min(100% - 1.25rem,1200px); }
  .filters { gap:.4rem; }
  .filter,.audience-filter,.accessory-filter,.brand-filter { padding:.55rem .7rem; font-size:.82rem; }
  .card-copy { padding:1rem; }
  .admin-body { padding:.75rem; }
  .install-card,.login-card { padding:1.35rem; }
  .admin-shell { width:min(100% - 1.25rem,1180px); }
  .admin-nav { gap:.25rem; }
  .admin-nav a { padding:.35rem .45rem; font-size:.84rem; }
}
@media (max-width:620px) {
  .image-lightbox { width:100vw; height:100svh; max-width:none; max-height:none; margin:0; padding:4.75rem 1rem 1.25rem; border:0; border-radius:0; }
  .lightbox-close { top:1rem; right:1rem; width:3rem; height:3rem; font-size:2rem; }
}