/* Alora Delhi — Warm Coastal Theme v2.0 | Reference: visitalora.com */
@import url('https://fonts.googleapis.com/css2?family=Antic+Didone&family=Arapey:ital@0;1&display=swap');

/* ═══ RESET ═══ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ═══ DESIGN TOKENS ═══ */
:root {
  --cream:       #f7f3dd;
  --cream-alt:   #ede9d0;
  --charcoal:    #333333;
  --gold:        #a67c2e;
  --gold-light:  #c9a84c;
  --dark:        #1a1a1a;
  --muted:       #6b6450;
  --border:      #d4cba8;
  --white:       #ffffff;
  --font-heading: 'Antic Didone', serif;
  --font-body:    'Arapey', serif;
}

/* ═══ BASE ═══ */
html { scroll-behavior: smooth; }

body {
  font-family: var(--font-body);
  background-color: var(--cream);
  color: var(--charcoal);
  font-size: 1rem;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
}

/* Override WP default dark body background */
body.wp-block-group { background-color: var(--cream) !important; }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 400;
  color: var(--charcoal);
  line-height: 1.15;
}

p { color: var(--muted); line-height: 1.85; }

a { color: var(--gold); text-decoration: none; transition: color 0.2s; }
a:hover { color: var(--charcoal); }

img { max-width: 100%; height: auto; display: block; }

/* ═══ FADE-IN ON LOAD ═══ */
body { opacity: 0; transition: opacity 0.4s ease; }
body.loaded { opacity: 1; }

/* ═══ HEADER ═══ */
.alora-header {
  background-color: var(--cream) !important;
  border-bottom: 1px solid var(--border) !important;
  transition: box-shadow 0.3s ease;
  z-index: 100;
}

.alora-header.scrolled {
  box-shadow: 0 2px 20px rgba(51,51,51,0.08);
}

/* Logo — natural colour on cream background */
.alora-logo img {
  height: 44px;
  width: auto;
  max-width: 130px;
  object-fit: contain;
}

/* Fallback text if no logo set */
.alora-site-title-fallback {
  font-family: var(--font-heading) !important;
  font-size: 1.5rem !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--charcoal) !important;
}
.wp-block-site-logo:not(:empty) + .alora-site-title-fallback { display: none !important; }

/* Footer logo — white on dark */
.alora-footer-logo img {
  height: 40px;
  width: auto;
  filter: brightness(0) invert(1);
  opacity: 0.85;
}

/* Nav links */
.alora-nav .wp-block-navigation__container,
.alora-nav .wp-block-navigation-item__content {
  color: var(--charcoal) !important;
  font-family: var(--font-body) !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transition: color 0.2s;
}
.alora-nav .wp-block-navigation-item__content:hover {
  color: var(--gold) !important;
}

/* Mobile nav overlay */
.wp-block-navigation__responsive-dialog {
  background-color: var(--cream) !important;
}

/* ═══ HERO ═══ */
.alora-hero {
  position: relative;
  overflow: hidden;
}

.alora-hero .wp-block-cover__image-background {
  transform: scale(1.05);
  transition: transform 8s ease;
  object-position: center 30%;
}

.alora-hero.loaded .wp-block-cover__image-background { transform: scale(1); }

.alora-hero-content {
  animation: heroFadeUp 1.2s ease both;
  animation-delay: 0.3s;
}

@keyframes heroFadeUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Scroll hint line */
.alora-scroll-hint {
  position: absolute;
  bottom: 2.5rem;
  left: 50%;
  transform: translateX(-50%);
}
.alora-scroll-hint span {
  display: block;
  width: 1px;
  height: 50px;
  background: linear-gradient(to bottom, rgba(247,243,221,0.7), transparent);
  animation: scrollLine 2s ease-in-out infinite;
}
@keyframes scrollLine {
  0%   { opacity: 0; transform: scaleY(0); transform-origin: top; }
  50%  { opacity: 1; }
  100% { opacity: 0; transform: scaleY(1); transform-origin: top; }
}

/* Hero outline button */
.alora-hero-outline-btn,
.alora-btn-outline .wp-block-button__link {
  background: transparent !important;
  color: var(--cream) !important;
  border: 1px solid var(--cream) !important;
  border-radius: 0 !important;
  padding: 1.1rem 3rem !important;
  font-family: var(--font-body) !important;
  font-size: 0.8rem !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  transition: background 0.25s, color 0.25s;
}
.alora-hero-outline-btn:hover,
.alora-btn-outline .wp-block-button__link:hover {
  background: var(--cream) !important;
  color: var(--dark) !important;
}

/* ═══ PAGE HERO ═══ */
.alora-page-hero .wp-block-cover__image-background {
  object-position: center 40%;
}

/* ═══ TAGLINE STRIP ═══ */
.alora-tagline-strip {
  background-color: var(--cream-alt);
}

/* ═══ STORY SECTION ═══ */
.alora-story-image-col .wp-block-image,
.alora-story-image-col figure {
  margin: 0;
  height: 100%;
  min-height: 500px;
}

.alora-story-image-col img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.alora-story-text-col {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* ═══ DISH CARDS ═══ */
.alora-dish-card {
  transition: transform 0.3s ease;
}

.alora-dish-card:hover { transform: translateY(-4px); }

.alora-dish-img figure,
.alora-dish-img.wp-block-image {
  margin: 0;
  overflow: hidden;
  aspect-ratio: 4/3;
}

.alora-dish-img img,
.alora-dish-card .wp-block-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
  aspect-ratio: 4/3;
}

.alora-dish-card:hover .wp-block-image img { transform: scale(1.04); }

/* ═══ GALLERY STRIP ═══ */
.alora-gallery-strip .wp-block-columns,
.alora-gallery-strip-2 .wp-block-columns {
  gap: 0 !important;
}

.alora-strip-img figure,
.alora-strip-img.wp-block-image { margin: 0; overflow: hidden; }

.alora-strip-img img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease, filter 0.3s;
}

.alora-strip-img:hover img {
  transform: scale(1.04);
  filter: brightness(1.05);
}

/* Tall image in cocktail section */
.alora-tall-img figure,
.alora-tall-img.wp-block-image { margin: 0; height: 100%; min-height: 450px; }
.alora-tall-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Cocktail text column */
.alora-cocktail-text-col,
.alora-gallery-text-col { background-color: var(--cream-alt); }

/* ═══ ATMOSPHERE SECTION ═══ */
.alora-atmosphere-section .wp-block-cover__image-background {
  object-position: center 60%;
}

/* ═══ CTA SECTION ═══ */
.alora-cta-section {
  background-color: var(--cream) !important;
  text-align: center;
}

/* ═══ TEXT LINK STYLE ═══ */
.alora-text-link,
a.alora-text-link {
  color: var(--gold);
  font-size: 0.78rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px solid var(--gold);
  padding-bottom: 2px;
  transition: color 0.2s, border-color 0.2s;
}
.alora-text-link:hover { color: var(--charcoal); border-color: var(--charcoal); }

/* ═══ MENU PAGE ═══ */
.alora-menu-tabs-wrap {
  background-color: var(--cream-alt) !important;
  border-bottom: 1px solid var(--border) !important;
}

.alora-tab-bar {
  display: flex;
  justify-content: center;
  gap: 0;
  padding: 0;
}

.alora-tab {
  background: transparent;
  border: none;
  border-bottom: 3px solid transparent;
  color: var(--muted);
  cursor: pointer;
  font-family: var(--font-body);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  padding: 1.25rem 2.5rem;
  text-transform: uppercase;
  transition: color 0.2s, border-color 0.2s;
}

.alora-tab:hover { color: var(--charcoal); }

.alora-tab.active {
  color: var(--charcoal);
  border-bottom-color: var(--gold);
}

/* Menu category */
.alora-menu-category {
  margin-bottom: 4rem;
}

.alora-cat-title {
  border-bottom: 1px solid var(--border);
  margin-bottom: 2rem;
  padding-bottom: 1rem;
}

.alora-cat-title h2 {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 400;
  color: var(--charcoal);
  letter-spacing: 0.02em;
}

/* Menu grid — 2 columns */
.alora-menu-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}

.alora-menu-item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid rgba(212,203,168,0.5);
}

.alora-menu-item:nth-child(odd) { padding-right: 2.5rem; }
.alora-menu-item:nth-child(even) { padding-left: 2.5rem; border-left: 1px solid rgba(212,203,168,0.5); }

.alora-item-info {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  flex: 1;
}

.alora-item-name {
  font-family: var(--font-heading);
  font-size: 1.1rem;
  color: var(--charcoal);
  letter-spacing: 0.01em;
  line-height: 1.3;
}

.alora-item-desc {
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--muted);
  font-style: italic;
  line-height: 1.6;
}

.alora-item-price {
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--gold);
  white-space: nowrap;
  flex-shrink: 0;
  padding-top: 0.2rem;
  letter-spacing: 0.05em;
}

/* ═══ RESERVATIONS PAGE ═══ */
/* CF7 Form Styling — warm theme */
.wpcf7-form .wpcf7-text,
.wpcf7-form .wpcf7-email,
.wpcf7-form .wpcf7-tel,
.wpcf7-form .wpcf7-number,
.wpcf7-form .wpcf7-date,
.wpcf7-form .wpcf7-select,
.wpcf7-form .wpcf7-textarea {
  width: 100%;
  background-color: var(--white);
  border: 1px solid var(--border);
  border-radius: 0;
  color: var(--charcoal);
  font-family: var(--font-body);
  font-size: 0.95rem;
  padding: 0.9rem 1rem;
  transition: border-color 0.2s;
  outline: none;
  margin-bottom: 1.25rem;
  box-shadow: none;
  -webkit-appearance: none;
}

.wpcf7-form .wpcf7-text:focus,
.wpcf7-form .wpcf7-email:focus,
.wpcf7-form .wpcf7-tel:focus,
.wpcf7-form .wpcf7-select:focus,
.wpcf7-form .wpcf7-textarea:focus {
  border-color: var(--gold);
  background-color: #fdfaf0;
}

.wpcf7-form .wpcf7-textarea { min-height: 130px; resize: vertical; }

.wpcf7-form label {
  display: block;
  font-family: var(--font-body);
  font-size: 0.75rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--charcoal);
  margin-bottom: 0.5rem;
}

.wpcf7-form .wpcf7-submit {
  background-color: var(--charcoal);
  border: none;
  border-radius: 0;
  color: var(--cream);
  cursor: pointer;
  font-family: var(--font-body);
  font-size: 0.78rem;
  letter-spacing: 0.2em;
  padding: 1rem 2.5rem;
  text-transform: uppercase;
  transition: background-color 0.25s;
}

.wpcf7-form .wpcf7-submit:hover { background-color: var(--gold); }

/* ═══ MAP ═══ */
.alora-map { overflow: hidden; }
.alora-map iframe { display: block; }

/* ═══ FOOTER ═══ */
.alora-footer {
  background-color: var(--dark) !important;
}

.alora-footer a {
  color: #8a8070;
  text-decoration: none;
  transition: color 0.2s;
}
.alora-footer a:hover { color: var(--gold); }

/* ═══ COVER BLOCKS — ensure cream pages don't bleed dark ═══ */
.wp-block-group:not(.alora-header):not(.alora-footer):not(.alora-cocktail-text-col):not(.alora-gallery-text-col) {
  background-color: transparent;
}

/* Sections explicitly on cream */
.alora-story-section,
.alora-dishes-section,
.alora-cta-section,
.alora-menu-section {
  background-color: var(--cream) !important;
}

.alora-tagline-strip,
.alora-cocktail-text-col,
.alora-gallery-text-col {
  background-color: var(--cream-alt) !important;
}

/* ═══ SCROLL REVEAL ═══ */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ═══ BUTTONS — default WP block ═══ */
.wp-block-button__link {
  border-radius: 0 !important;
  transition: background-color 0.25s, color 0.25s, border-color 0.25s;
}

/* ═══ RESPONSIVE ═══ */
@media (max-width: 1024px) {
  .alora-story-text-col { padding: 4rem 3rem !important; }
  .alora-cocktail-text-col { padding: 4rem 3rem !important; }
}

@media (max-width: 768px) {
  /* Stack story columns */
  .alora-story-columns .wp-block-column { flex-basis: 100% !important; }
  .alora-story-image-col .wp-block-image { min-height: 300px; }
  .alora-story-text-col { padding: 3rem 1.5rem !important; }

  /* Stack cocktail columns */
  .alora-cocktail-img-col,
  .alora-cocktail-text-col { flex-basis: 100% !important; }
  .alora-cocktail-text-col { padding: 3rem 1.5rem !important; }

  /* Gallery strip — 2 cols on mobile */
  .alora-gallery-strip .wp-block-columns { flex-wrap: wrap !important; }
  .alora-gallery-strip .wp-block-column { flex-basis: 50% !important; }

  /* Menu grid — 1 column on mobile */
  .alora-menu-grid { grid-template-columns: 1fr; }
  .alora-menu-item:nth-child(odd) { padding-right: 0; }
  .alora-menu-item:nth-child(even) { padding-left: 0; border-left: none; }

  /* Tab bar */
  .alora-tab { padding: 1rem 1.25rem; font-size: 0.72rem; }

  /* Footer columns */
  .alora-footer .wp-block-columns { flex-direction: column !important; }
  .alora-footer .wp-block-column { flex-basis: 100% !important; }

  /* Header padding */
  .alora-header { padding-left: 1.25rem !important; padding-right: 1.25rem !important; }

  /* Section padding */
  .alora-dishes-section,
  .alora-cta-section { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
}

@media (max-width: 480px) {
  /* Gallery strip — 1 col on small */
  .alora-gallery-strip .wp-block-column { flex-basis: 100% !important; }
  .alora-strip-img img { aspect-ratio: 16/9; }

  .alora-tab-bar { flex-direction: column; }
  .alora-tab { border-bottom: none; border-left: 3px solid transparent; text-align: left; padding: 0.75rem 1.25rem; }
  .alora-tab.active { border-left-color: var(--gold); }
}

/* ═══ MOBILE STICKY CTA BAR ═══ */
.alora-mobile-cta { display: none; }

@media (max-width: 768px) {
  body { padding-bottom: 68px; }

  .alora-mobile-cta {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
    height: 68px;
    border-top: 1px solid var(--border);
    box-shadow: 0 -6px 24px rgba(26,26,26,0.13);
    overflow: hidden;
  }

  .alora-mobile-cta-btn {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 8px 4px;
    text-decoration: none;
    font-family: var(--font-body);
    font-size: 0.62rem;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    transition: filter 0.18s;
    -webkit-tap-highlight-color: transparent;
  }

  .alora-mobile-cta-btn:active { filter: brightness(0.88); }

  /* Call — cream base, gold icon, primary tap action */
  .alora-mcta-call {
    background-color: var(--cream);
    color: var(--charcoal);
    border-right: 1px solid var(--border);
  }
  .alora-mcta-call .alora-mcta-icon { color: var(--gold); }

  /* WhatsApp — cream base, green icon pulse of recognition */
  .alora-mcta-wa {
    background-color: var(--cream);
    color: var(--charcoal);
    border-right: 1px solid var(--border);
  }
  .alora-mcta-wa .alora-mcta-icon { color: #25D366; }

  /* Reserve Table — gold, primary CTA */
  .alora-mcta-reserve {
    background-color: var(--gold);
    color: var(--cream);
    position: relative;
  }
  .alora-mcta-reserve::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: var(--gold-light);
  }

  /* View Menu — charcoal */
  .alora-mcta-menu {
    background-color: var(--charcoal);
    color: var(--cream);
    border-left: 1px solid rgba(255,255,255,0.08);
  }

  .alora-mcta-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
  }

  .alora-mcta-label { line-height: 1; }
}

/* ═══ PAGE TRANSITION ═══ */
.page-transitioning { opacity: 0 !important; transition: opacity 0.25s ease; }
