/* ==========================================================================
   Language picker — full-screen modal on first visit
   ========================================================================== */
#lang-picker {
  position: fixed;
  inset: 0;
  z-index: 999;
  background: var(--cream);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 2.5rem;
  padding: 2rem;
  opacity: 1;
  transition: opacity 0.4s ease;
}
#lang-picker.hide {
  opacity: 0;
  pointer-events: none;
}

.lp-brand {
  font-family: 'Fraunces', serif;
  font-size: clamp(1.8rem, 5vw, 2.8rem);
  font-weight: 700;
  color: var(--walnut);
  text-align: center;
  line-height: 1.2;
}
.lp-brand span { color: var(--amber); }

.lp-prompt {
  font-size: 0.9rem;
  color: #8a7a6c;
  text-align: center;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.lp-options {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  justify-content: center;
}

.lp-btn {
  min-width: 160px;
  padding: 1rem 2rem;
  border-radius: 999px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  border: 2px solid transparent;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.3rem;
  font-family: 'Inter', sans-serif;
}
.lp-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px -8px rgba(62,42,31,0.2);
}
.lp-btn-en {
  background: var(--walnut);
  color: var(--cream);
}
.lp-btn-ur {
  background: var(--amber);
  color: var(--white);
  font-family: 'Noto Nastaliq Urdu', serif;
  font-size: 1.15rem;
}
.lp-sub {
  font-size: 0.72rem;
  opacity: 0.7;
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  letter-spacing: 0.04em;
}

/* ==========================================================================
   Urdu / RTL font override
   ========================================================================== */
html.urdu {
  --font-display: 'Noto Nastaliq Urdu', serif;
  --font-body:    'Noto Nastaliq Urdu', serif;
}

html.urdu body {
  font-family: var(--font-body);
  font-size: 1.05rem; /* Nastaliq reads better slightly larger */
  line-height: 2;     /* Nastaliq needs more line height */
}

html.urdu h1,
html.urdu h2,
html.urdu h3 {
  font-family: var(--font-display);
  line-height: 1.6;
}

/* Flip nav layout for RTL — desktop only, mobile menu must stay column */
@media (min-width: 860px) {
  html.urdu .nav-links { flex-direction: row-reverse; }
  html.urdu .nav-actions { flex-direction: row-reverse; }
}
html.urdu .hero-actions { flex-direction: row-reverse; }
html.urdu .footer-inner { direction: rtl; }
html.urdu .cart-drawer { right: auto; left: 0; transform: translateX(-100%); }
html.urdu .cart-drawer.open { transform: translateX(0); }
html.urdu .cart-drawer { box-shadow: 12px 0 40px rgba(0,0,0,0.2); }

/* Mobile menu in Urdu must stay vertical */
html.urdu .nav-links.open {
  flex-direction: column;
  align-items: flex-end; /* right-align items for RTL feel */
}
html.urdu .nav-links.open li a,
html.urdu .nav-links.open .nav-lang-item {
  text-align: right;
  width: 100%;
}

/* Move lang toggle into mobile menu — hidden in nav bar on small screens */
#lang-toggle { display: none; }

@media (min-width: 860px) {
  #lang-toggle { display: inline-flex; }
}

/* Lang toggle shared style */
#lang-toggle,
#lang-toggle-mobile {
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0.35rem 0.9rem;
  border-radius: 999px;
  border: 1.5px solid var(--cream-dim);
  background: transparent;
  color: var(--walnut);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
  letter-spacing: 0.04em;
  align-items: center;
  justify-content: center;
}
#lang-toggle:hover,
#lang-toggle-mobile:hover {
  background: var(--walnut);
  color: var(--cream);
}

/* Mobile menu lang entry — only visible inside the hamburger menu */
.nav-lang-item {
  display: block;
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--cream-dim);
}
.nav-lang-item:last-child { border-bottom: none; }

@media (min-width: 860px) {
  .nav-lang-item { display: none; }
}