:root{
  --bg:#ffffff;
  --bg-alt:#f7f5f0;
  --gold:#ff9b00;
  --gold-light:#cc7c00;
  --text:#1a1a1a;
  --text-muted:#767267;
  --border:#e6e2d8;
  --header-bg:rgba(255,255,255,.95);
  --img-a:#f0ede4;
  --img-b:#e6e1d4;
}

[data-theme="dark"]{
  --bg:#0d0d0d;
  --bg-alt:#161616;
  --gold:#ff9b00;
  --gold-light:#ffb84d;
  --text:#f2f0ea;
  --text-muted:#a8a49a;
  --border:#2a2a2a;
  --header-bg:rgba(13,13,13,.95);
  --img-a:#1e1e1e;
  --img-b:#141414;
}

*{margin:0;padding:0;box-sizing:border-box;}

body{
  background:var(--bg);
  color:var(--text);
  font-family:'Montserrat',sans-serif;
  font-weight:300;
  line-height:1.6;
  transition:background .25s, color .25s;
}

h1,h2,h3{
  font-family:'Playfair Display','Noto Naskh Arabic',serif;
  font-weight:600;
}

html[dir="rtl"] body{
  font-family:'Noto Naskh Arabic','Montserrat',sans-serif;
}
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3{
  font-family:'Noto Naskh Arabic',serif;
}

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

/* Topbar */
.topbar{
  background:var(--gold);
  color:#0d0d0d;
  text-align:center;
  font-size:.8rem;
  font-weight:500;
  padding:8px 12px;
  letter-spacing:.02em;
}

/* Top header */
.topheader{
  background:var(--bg-alt);
  border-bottom:1px solid var(--border);
}
.topheader-inner{
  max-width:1200px;
  margin:0 auto;
  padding:8px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  font-size:.78rem;
}
.topheader-link{
  display:flex;
  align-items:center;
  gap:6px;
  color:var(--text-muted);
  transition:color .2s;
}
.topheader-link:hover{color:var(--gold-light);}
.topheader-right{
  display:flex;
  align-items:center;
  gap:12px;
}
.topheader-right .lang-switch{
  padding:3px 6px;
  font-size:.72rem;
}

/* Header */
.site-header{
  background:var(--header-bg);
  border-bottom:1px solid var(--border);
  position:sticky;
  top:0;
  z-index:100;
}
.header-inner{
  max-width:1200px;
  margin:0 auto;
  padding:18px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.logo{
  font-family:'Playfair Display',serif;
  font-size:1.6rem;
  font-weight:700;
  letter-spacing:.05em;
}
.logo span{color:var(--gold);}
.main-nav{
  display:flex;
  gap:28px;
  flex:1;
  justify-content:center;
}
.main-nav a{
  font-size:.82rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--text-muted);
  transition:color .2s;
}
.main-nav a:hover{color:var(--gold-light);}
.header-icons{
  display:flex;
  gap:18px;
  align-items:center;
  font-size:1.1rem;
}
.icon-btn{
  background:none;
  border:none;
  padding:0;
  color:inherit;
  font-size:inherit;
  cursor:pointer;
  line-height:1;
}

/* Search bar */
.search-bar{
  max-height:0;
  overflow:hidden;
  transition:max-height .25s ease;
  border-top:0 solid var(--border);
}
.search-bar.open{
  max-height:80px;
  border-top:1px solid var(--border);
}
.search-bar-form{
  max-width:1200px;
  margin:0 auto;
  padding:16px 24px;
  display:flex;
  gap:10px;
}
.search-bar-form input{
  flex:1;
  background:var(--bg-alt);
  border:1px solid var(--border);
  color:var(--text);
  padding:12px 16px;
  border-radius:2px;
  font-family:inherit;
  font-size:.9rem;
}
.search-bar-form input:focus{
  outline:none;
  border-color:var(--gold);
}
.search-bar-form button{
  background:var(--gold);
  color:#111;
  border:none;
  padding:0 20px;
  border-radius:2px;
  cursor:pointer;
  font-size:1rem;
}
.lang-switch{
  background:transparent;
  color:var(--text);
  border:1px solid var(--border);
  border-radius:2px;
  padding:5px 8px;
  font-family:'Montserrat',sans-serif;
  font-size:.78rem;
  letter-spacing:.04em;
  cursor:pointer;
}
.lang-switch:hover,
.lang-switch:focus{
  border-color:var(--gold);
  outline:none;
}
.lang-switch option{
  background:var(--bg);
  color:var(--text);
}
.cart-count{
  font-size:.65rem;
  background:var(--gold);
  color:#0d0d0d;
  border-radius:50%;
  padding:1px 5px;
  margin-left:2px;
  vertical-align:top;
}
.burger{
  display:none;
  background:none;
  border:none;
  color:var(--text);
  font-size:1.4rem;
  cursor:pointer;
}

.btn-primary{
  display:inline-block;
  background:var(--gold);
  color:#0d0d0d;
  padding:14px 36px;
  font-size:.85rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-weight:600;
  border-radius:2px;
  transition:background .2s;
}
.btn-primary:hover{background:var(--gold-light);}

/* Section titles */
.section-title{
  text-align:center;
  font-size:1.9rem;
  margin:0 auto 40px;
  padding-top:70px;
  max-width:1200px;
  padding-left:24px;
  padding-right:24px;
}

/* Categories */
.categories{max-width:1200px;margin:0 auto;padding:0 24px 40px;}
.category-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:20px;
}
.category-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  text-align:center;
}
.category-img{
  width:100%;
  max-width:100px;
  aspect-ratio:1;
  margin:0 auto;
  border-radius:50%;
  background:var(--gold);
  border:2px solid var(--gold);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.9rem;
  color:#111;
  transition:background .2s, color .2s, transform .2s;
}
.category-card:hover .category-img{
  background:var(--text);
  border-color:var(--text);
  color:var(--bg);
  transform:translateY(-4px);
}
.category-card span{
  font-size:.85rem;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--text);
  font-weight:500;
}
.category-card:hover span{color:var(--gold-light);}

/* Products */
.products{max-width:1200px;margin:0 auto;padding:0 24px 20px;}
.product-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:28px;
}
.product-card{
  display:block;
  background:var(--bg-alt);
  border:1px solid var(--border);
  border-radius:4px;
  overflow:hidden;
  transition:transform .2s, border-color .2s;
}
.product-card:hover{
  transform:translateY(-4px);
  border-color:var(--gold);
}
.product-img{
  aspect-ratio:1;
  background:linear-gradient(135deg,var(--img-a),var(--img-b));
}
.product-card h3{
  font-size:1rem;
  font-weight:600;
  padding:16px 16px 4px;
}
.product-specs{
  font-size:.78rem;
  color:var(--text-muted);
  padding:0 16px;
}
.product-price{
  font-size:1.05rem;
  color:var(--gold-light);
  font-weight:600;
  padding:10px 16px 18px;
}

/* Auth */
.auth-section{
  max-width:420px;
  margin:0 auto;
  padding:70px 24px 40px;
}
.auth-card{
  background:var(--bg-alt);
  border:1px solid var(--border);
  border-radius:4px;
  padding:36px 28px;
}
.auth-form{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.auth-form input{
  background:var(--bg);
  border:1px solid var(--border);
  color:var(--text);
  padding:12px 14px;
  font-size:.9rem;
  font-family:inherit;
  border-radius:2px;
}
.auth-form input:focus{
  outline:none;
  border-color:var(--gold);
}
.auth-form .btn-primary{
  border:none;
  cursor:pointer;
  margin-top:6px;
}
.auth-error{
  background:rgba(200,60,60,.1);
  border:1px solid rgba(200,60,60,.4);
  color:#c83c3c;
  border-radius:2px;
  padding:12px 14px;
  margin-bottom:18px;
  font-size:.85rem;
}
.auth-error p{margin:2px 0;}
.auth-link{
  text-align:center;
  margin-top:20px;
  font-size:.85rem;
  color:var(--text-muted);
}
.auth-link a{color:var(--gold-light);}

/* Product detail */
.breadcrumb{
  max-width:1200px;
  margin:0 auto;
  padding:24px 24px 0;
  font-size:.8rem;
  color:var(--text-muted);
}
.breadcrumb a{color:var(--text-muted);}
.breadcrumb a:hover{color:var(--gold-light);}
.product-detail{padding-bottom:60px;}
.product-detail-grid{
  max-width:900px;
  margin:40px auto 0;
  padding:0 24px;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:60px;
}
.product-detail-img{
  position:relative;
  aspect-ratio:1;
  border-radius:6px;
  border:1px solid var(--border);
  background:linear-gradient(135deg,var(--img-a),var(--img-b));
  display:flex;
  align-items:center;
  justify-content:center;
}
.product-detail-img::before{
  content:"\f3a5";
  font-family:"Font Awesome 6 Free";
  font-weight:900;
  font-size:3rem;
  color:var(--border);
}
.product-detail-info{
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.product-detail-info h1{
  font-size:1.6rem;
  line-height:1.3;
  margin-bottom:14px;
}
.product-detail-price{
  font-size:1.6rem;
  color:var(--gold-light);
  font-weight:600;
  margin-bottom:22px;
}
.cart-flash{
  color:var(--gold-light);
  margin-bottom:14px;
  font-size:.85rem;
}
.product-detail-form{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin-bottom:20px;
}
.product-detail-form label{
  font-size:.8rem;
  color:var(--text-muted);
}
.product-detail-form input{
  width:70px;
  background:var(--bg-alt);
  border:1px solid var(--border);
  color:var(--text);
  padding:10px;
  border-radius:2px;
  font-family:inherit;
  text-align:center;
}
.product-detail-form .btn-primary{
  border:none;
  cursor:pointer;
}
.product-detail-description{
  max-width:700px;
  margin:60px auto 0;
  padding:40px 24px 0;
  border-top:1px solid var(--border);
  text-align:center;
}
.product-detail-description p{
  color:var(--text-muted);
  font-size:.95rem;
  line-height:1.7;
}

/* Cart */
.cart-section{max-width:1200px;margin:0 auto;padding:70px 24px 40px;}
.cart-remove-btn{
  background:none;
  border:none;
  color:var(--text-muted);
  cursor:pointer;
  font-size:1rem;
}
.cart-remove-btn:hover{color:#c83c3c;}
.cart-summary{
  max-width:900px;
  margin:24px auto 0;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:24px;
}
.cart-total{
  font-size:1.1rem;
}
.cart-total span{
  color:var(--gold-light);
  font-weight:600;
}
.auth-form textarea{
  background:var(--bg);
  border:1px solid var(--border);
  color:var(--text);
  padding:12px 14px;
  font-size:.9rem;
  font-family:inherit;
  border-radius:2px;
  resize:vertical;
}
.auth-form textarea:focus{
  outline:none;
  border-color:var(--gold);
}

/* Admin */
.admin-table{
  width:100%;
  border-collapse:collapse;
  font-size:.85rem;
}
.admin-table th,
.admin-table td{
  padding:12px 10px;
  border-bottom:1px solid var(--border);
  text-align:left;
  white-space:nowrap;
}
.admin-table th{
  color:var(--text-muted);
  text-transform:uppercase;
  font-size:.72rem;
  letter-spacing:.05em;
}
.admin-price-form{
  display:flex;
  align-items:center;
  gap:8px;
}
.admin-price-form input{
  width:90px;
  background:var(--bg-alt);
  border:1px solid var(--border);
  color:var(--text);
  padding:8px 10px;
  border-radius:2px;
  font-family:inherit;
}
.admin-price-form .btn-primary{
  padding:8px 14px;
  font-size:.72rem;
  border:none;
  cursor:pointer;
}
.admin-sale-price{
  color:var(--gold-light);
  font-weight:600;
}

/* Filter bar */
.filter-bar{
  max-width:1200px;
  margin:0 auto 20px;
  padding:0 24px;
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  justify-content:center;
  gap:20px;
}
.filter-group{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.filter-group label{
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--text-muted);
}
.filter-group input{
  width:100px;
  background:var(--bg-alt);
  border:1px solid var(--border);
  color:var(--text);
  padding:9px 10px;
  border-radius:2px;
  font-family:inherit;
  font-size:.85rem;
}
.filter-group input:focus,
.filter-bar select:focus{
  outline:none;
  border-color:var(--gold);
}
.filter-bar .btn-primary{
  border:none;
  cursor:pointer;
  padding:10px 22px;
}
.filter-reset{
  font-size:.78rem;
  color:var(--text-muted);
  text-decoration:underline;
  align-self:center;
}
.filter-reset:hover{color:var(--gold-light);}

/* Pagination */
.pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  margin:40px auto 0;
  padding-top:30px;
  border-top:1px solid var(--border);
  font-size:.85rem;
}
.pagination a{
  color:var(--gold-light);
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:.78rem;
}
.pagination a:hover{color:var(--gold);}
.pagination-current{color:var(--text-muted);}

.section-link{
  display:block;
  text-align:center;
  margin-top:24px;
  color:var(--gold-light);
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:.8rem;
}
.section-link:hover{color:var(--gold);}

/* Footer */
.site-footer{
  background:var(--bg-alt);
  border-top:1px solid var(--border);
  margin-top:80px;
  padding:60px 24px 24px;
}
.footer-grid{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1.4fr;
  gap:32px;
}
.footer-grid h4{
  font-family:'Montserrat',sans-serif;
  font-size:.85rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--gold);
  margin-bottom:16px;
}
.footer-text{color:var(--text-muted);font-size:.85rem;}
.footer-grid a{
  display:block;
  color:var(--text-muted);
  font-size:.85rem;
  margin-bottom:10px;
}
.footer-grid a:hover{color:var(--gold-light);}
.newsletter-form{display:flex;gap:8px;}
.newsletter-form input{
  flex:1;
  background:var(--bg);
  border:1px solid var(--border);
  color:var(--text);
  padding:10px 12px;
  font-size:.85rem;
  border-radius:2px;
}
.newsletter-form button{
  background:var(--gold);
  color:#0d0d0d;
  border:none;
  padding:0 16px;
  font-weight:600;
  border-radius:2px;
  cursor:pointer;
}
.payment-icons{
  max-width:1200px;
  margin:40px auto 0;
  padding-top:24px;
  border-top:1px solid var(--border);
  display:flex;
  justify-content:center;
  gap:22px;
  font-size:1.8rem;
  color:var(--text-muted);
}
.payment-icons i{transition:color .2s;}
.payment-icons i:hover{color:var(--gold-light);}

.footer-bottom{
  max-width:1200px;
  margin:16px auto 0;
  font-size:.75rem;
  color:var(--text-muted);
  text-align:center;
}

/* Responsive */
@media (max-width:860px){
  .main-nav{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    background:var(--bg);
    flex-direction:column;
    padding:20px;
    border-bottom:1px solid var(--border);
  }
  .main-nav.open{display:flex;}
  .burger{display:block;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .product-detail-grid{grid-template-columns:1fr;}
}