:root{
  /* Emirates / UAE themed palette */
  --bg: #0e0f12;           /* page background (dark) */
  --surface: #15171c;      /* cards / panels */
  --muted-border: #262a31; /* borders */
  --muted-text: #b7bcc6;   /* secondary text */
  --text: #e9eaed;         /* main text */
  --accent-green: #007a3d; /* UAE green (primary accent) */
  --accent-red: #C8102E;   /* UAE red (alerts / highlights) */
  --accent-gold: #FFD700;  /* gold (luxury highlight) */
  --black: #000000;
  --card-radius: 16px;
  --glass-bg: rgba(14,15,18,.7);
}

/* base */
body {
  background: var(--bg);
  color: var(--text);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  margin: 0;
}
a { text-decoration: none; color: inherit; }

/* images */
img { max-width: 100%; height: auto; }

/* header / topbar */
header {
  position: sticky;
  top: 0;
  z-index: 1030;
  backdrop-filter: blur(8px);
  background: var(--glass-bg);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.topbar {
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.6rem .9rem;
}
.logo { height: 36px; }

/* search */
.search-wrap { flex:1; display:flex; gap:.5rem; }
.search-wrap .form-control,
.search-wrap .form-select {
  background: var(--surface);
  border: 1px solid var(--muted-border);
  color: var(--text);
  border-radius: 10px;
  padding: .45rem .6rem;
}

/* carousel */
.carousel .carousel-item img {
  object-fit: cover;
  height: 180px;
  object-position: top center;
}

/* product card */
.product-card {
  background: var(--surface);
  border: 1px solid var(--muted-border);
  border-radius: var(--card-radius);
  overflow:hidden;
  transition: transform .2s ease, box-shadow .2s ease;
  height:100%;
  display:flex;
  flex-direction:column;
  box-shadow: 0 6px 20px rgba(0,0,0,0.45);
}
.product-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 28px rgba(0,0,0,0.55);
}
.product-title {
  font-weight:700;
  font-size:1.05rem;
  color: var(--text);
}
.product-description { color: var(--muted-text); font-size:.9rem; min-height:48px; }

/* price & qty */
.price-qty { display:flex; justify-content:space-between; align-items:center; gap:.5rem; }
.qty { display:flex; align-items:center; gap:.4rem; }
.qty input {
  width:64px;
  text-align:center;
  background: var(--bg);
  border:1px solid #2b313a;
  color: var(--text);
  border-radius:10px;
  padding:.35rem;
}

/* buttons */
.btn-custom {
  background: linear-gradient(90deg, var(--accent-green), #109f56);
  border: none;
  color: #fff;
  border-radius: 12px;
  padding: .5rem .75rem;
  cursor: pointer;
  font-weight: 600;
  box-shadow: 0 6px 18px rgba(0,122,61,0.12);
}
.btn-custom[disabled] { background:#3a3d46; cursor: not-allowed; }

/* secondary button (red accent) */
.btn-danger {
  background: linear-gradient(90deg, var(--accent-red), #d32b2b);
  border: none;
  color: #fff;
  border-radius: 10px;
  padding: .45rem .65rem;
  font-weight:600;
  cursor:pointer;
}

/* bottom nav */
.bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  display:flex;
  justify-content:space-around;
  background: #0f1116;
  border-top:1px solid #23262d;
  z-index:1030;
  padding:.35rem 0;
}
.bottom-nav .nav-item {
  padding:.35rem .9rem;
  border-radius:12px;
  color:#cfd3da;
  position:relative;
}
.bottom-nav .nav-item.active,
.bottom-nav .nav-item:hover { background:#191c23; color:var(--text); }
.bottom-nav .badge {
  position:absolute;
  top:-6px;
  inset-inline-end:-4px;
  background: var(--accent-red);
  color:#fff;
  padding:2px 6px;
  font-size:.75rem;
  border-radius:8px;
}

/* cart sheet */
.cart {
  position: fixed;
  inset-inline: 0;
  bottom: 58px;
  max-height: 68vh;
  transform: translateY(110%);
  transition: transform .25s ease;
  background:#0f1116;
  border-top:1px solid #23262d;
  z-index: 1029;
}
.cart.active { transform: translateY(0); }
.cart-header { display:flex; justify-content:space-between; align-items:center; padding:.75rem 1rem; border-bottom:1px solid #23262d; }
.cart-body { padding: .75rem 1rem; overflow:auto; max-height: 44vh; }
.cart-item { display:grid; grid-template-columns:56px 1fr auto; align-items:center; gap:.6rem; padding:.55rem 0; border-bottom:1px dashed #23262d; }
.cart-item img { width:56px; height:56px; object-fit:cover; border-radius:10px; }
.cart-item .controls button { width:28px; height:28px; border:none; background:#1a1d25; color:#fff; border-radius:8px; }
.cart-footer { padding: .75rem 1rem 1rem; border-top:1px solid #23262d; }
.cart-empty { color:#9aa3af; text-align:center; padding:1rem 0; }

/* totals */
.total-line {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0.25rem 0;
  gap: 0.5rem;
}
.total-line strong { font-weight: 700; color: var(--text); }

/* cookie / consent notice */
.cookie-notice {
  position: fixed;
  inset-inline: 12px;
  bottom: 70px;
  background:#141821;
  border:1px solid var(--muted-border);
  border-radius:14px;
  padding:.75rem;
  display:none;
  z-index: 1040;
}
.cookie-notice.show { display:block; }

/* spacer so bottom nav doesn't cover content */
.page-bottom-spacer { height: 72px; }

/* inline footer (styled for UAE theme) */
.inline-footer {
    background: linear-gradient(180deg, rgba(1,23,68,0.25), rgba(2,17,68,0.6));
    color: var(--text);
    padding: 15px 0;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.35);
    font-size: 0.95rem;
}
.footer-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
}
.footer-section { display:flex; align-items:center; padding:0 15px; position:relative; }
.footer-section:not(:last-child):after {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 30px;
    width: 1px;
    background: rgba(255,255,255,0.06);
}
.footer-section h6 {
    font-weight: 700;
    margin: 0 10px 0 0;
    font-size: 0.9rem;
    color: var(--accent-gold);
    white-space: nowrap;
}
.footer-links { display:flex; gap:20px; margin:0; padding:0; }
.footer-links li { list-style:none; }
.footer-links a {
    color: var(--text);
    text-decoration:none;
    transition: color .25s ease;
    white-space:nowrap;
    font-size:0.85rem;
}
.footer-links a:hover { color: var(--accent-gold); }
.contact-info { display:flex; align-items:center; white-space:nowrap; }
.contact-info i { margin-left:8px; color: #25D366; }
.social-icons { display:flex; gap:10px; }
.social-icons a {
    display:flex; align-items:center; justify-content:center;
    width:30px; height:30px;
    background: rgba(255,255,255,0.04);
    border-radius:50%;
    transition: all .3s ease; color:var(--text); text-decoration:none;
}
.social-icons a:hover { background: rgba(255,215,0,0.12); transform: translateY(-2px); color: var(--accent-gold); }
.copyright { text-align:center; margin-top:15px; font-size:0.8rem; opacity:0.9; padding-top:15px; border-top:1px solid rgba(255,255,255,0.06); }

/* responsive tweaks */
@media (max-width: 992px) {
  .footer-container { flex-wrap:wrap; justify-content:center; }
  .footer-section { margin:5px 10px; }
  .footer-section:after { display:none; }
}
@media (max-width: 768px) {
  .footer-section { flex-basis:100%; justify-content:center; margin:10px 0; }
  .footer-links { justify-content:center; }
}

