/* =============================================================
   THEME.CSS — Zaira & Javier  (v1)
   Boda: Sábado 22 de Agosto, 2026

   PALETA:
   #232C31   → Azul grisáceo oscuro    (texto, nav, footer, secciones dark)
   #435B50   → Verde grisáceo profundo (texto secundario, hover, hospedaje bg)
   #B2B88A   → Verde oliva suave       (acento, íconos, kickers)
   #CEBDA8   → Beige cálido            (acento cálido, bordes suaves)
   #EAE3DB   → Marfil claro            (fondo general, textos sobre oscuro)

   TIPOGRAFÍAS:
   Dancing Script    → display (logo, hero h1, títulos principales)
   Cormorant Garamond → serif (subtítulos, cuerpo elegante)
   Montserrat         → sans (body, nav, labels)
   ============================================================= */


/* ─────────────────────────────────────────────
   1. PALETA GLOBAL
   ───────────────────────────────────────────── */
:root {
  --bg:        #EAE3DB;   /* Marfil claro — fondo general */
  --bg-soft:   #F5F1ED;   /* Marfil suave — secciones alternas */
  --text:      #232C31;   /* Azul grisáceo oscuro — texto principal */
  --muted:     #435B50;   /* Verde profundo — texto secundario */
  --white:     #ffffff;

  --gold:      #B2B88A;   /* Verde oliva suave — acento principal, íconos */
  --warm:      #CEBDA8;   /* Beige cálido — acento secundario, bordes */

  --font-display: 'Dancing Script', cursive;
  --font-serif:   'Dancing Script', cursive;    /* Principal → todos los h1, h2, h3 */
  --font-elegant: 'Cormorant Garamond', serif;  /* Secundaria → citas, fechas, subtítulos */
  --font-sans:    'Montserrat', sans-serif;     /* Cuerpo → nav, labels, body text */
}


/* ─────────────────────────────────────────────
   2. HEADER / BARRA DE NAVEGACIÓN
   ───────────────────────────────────────────── */
:root {
  --nav-bg:           rgba(35, 44, 49, 0.20);
  --nav-bg-scrolled:  rgba(35, 44, 49, 0.96);
  --nav-text:         #EAE3DB;
  --nav-hamburger:    #EAE3DB;
  --nav-dropdown-bg:  rgba(35, 44, 49, 0.97);
}


/* ─────────────────────────────────────────────
   3. HERO
   ───────────────────────────────────────────── */
:root {
  --hero-overlay:   rgba(35, 44, 49, 0.38);
  --hero-text:      #EAE3DB;
  --hero-ampersand: #B2B88A;
}


/* ─────────────────────────────────────────────
   4. CONTADOR
   ───────────────────────────────────────────── */
:root {
  --countdown-bg:          #EAE3DB;
  --countdown-date-color:  #232C31;
  --countdown-label-color: #435B50;
  --countdown-numbers:     #232C31;
  --countdown-units:       #435B50;
  --countdown-divider:     rgba(35, 44, 49, 0.15);
}


/* ─────────────────────────────────────────────
   5. BIENVENIDA
   ───────────────────────────────────────────── */
:root {
  --welcome-bg:           #F5F1ED;
  --welcome-intro-color:  #435B50;
  --welcome-divider:      #B2B88A;
  --welcome-name-color:   #435B50;
}


/* ─────────────────────────────────────────────
   6. ITINERARIO (sección oscura)
   ───────────────────────────────────────────── */
:root {
  --itinerary-bg:             #232C31;
  --itinerary-text:           #EAE3DB;
  --itinerary-icon-fill:      #B2B88A;
  --itinerary-btn-border:     rgba(234, 227, 219, 0.40);
  --itinerary-btn-hover-bg:   #435B50;
  --itinerary-btn-hover-text: #EAE3DB;
}


/* ─────────────────────────────────────────────
   7. DRESS CODE
   ───────────────────────────────────────────── */
:root {
  --dresscode-bg:           #EAE3DB;
  --dresscode-kicker:       #435B50;
  --dresscode-title:        #232C31;
  --dresscode-style-color:  #435B50;
  --dresscode-desc:         #435B50;
  --dresscode-divider:      rgba(67, 91, 80, 0.20);
}


/* ─────────────────────────────────────────────
   8. REGALOS / MESA DE REGALOS
   ───────────────────────────────────────────── */
:root {
  --gifts-bg:           #F5F1ED;
  --gifts-kicker:       #232C31;
  --gifts-title:        #232C31;
  --gifts-text:         #435B50;
  --gifts-btn-border:   #232C31;
  --gifts-btn-hover-bg: #232C31;
  --gifts-copy-border:  #232C31;
  --gifts-copy-hover:   #232C31;
  --gifts-copy-msg:     #435B50;
}


/* ─────────────────────────────────────────────
   9. HOSPEDAJE (sección verde profundo)
   ───────────────────────────────────────────── */
:root {
  --stay-bg:            #435B50;
  --stay-kicker:        #B2B88A;
  --stay-title:         #EAE3DB;
  --stay-card-bg:       #232C31;
  --stay-card-title:    #EAE3DB;
  --stay-location:      #B2B88A;
  --stay-btn-border:    #B2B88A;
  --stay-btn-solid-bg:  #232C31;
}


/* ─────────────────────────────────────────────
   10. TRANSPORTACIÓN
   (sección comentada — vars conservadas)
   ───────────────────────────────────────────── */
:root {
  --transport-bg:           #EAE3DB;
  --transport-kicker:       #232C31;
  --transport-title:        #232C31;
  --transport-text:         #435B50;
  --transport-card-bg:      #F5F1ED;
  --transport-divider:      #B2B88A;
  --transport-btn-border:   #435B50;
  --transport-btn-solid-bg: #232C31;
}


/* ─────────────────────────────────────────────
   11. CLIMA / PRONÓSTICO
   (sección comentada — vars conservadas)
   ───────────────────────────────────────────── */
:root {
  --weather-bg:       #F5F1ED;
  --weather-text:     #435B50;
  --weather-city:     #232C31;
}


/* ─────────────────────────────────────────────
   12. QUÉ HACER EN LA CIUDAD
   (sección comentada — vars conservadas)
   ───────────────────────────────────────────── */
:root {
  --city-bg:       #F5F1ED;
  --city-card-bg:  #EAE3DB;
  --city-kicker:   #232C31;
  --city-title:    #232C31;
}


/* ─────────────────────────────────────────────
   13. AVISO — SOLO ADULTOS
   ───────────────────────────────────────────── */
:root {
  --adults-bg:     #232C31;
  --adults-text:   #EAE3DB;
  --adults-kicker: #B2B88A;
}


/* ─────────────────────────────────────────────
   14. RSVP / FORMULARIO
   ───────────────────────────────────────────── */
:root {
  --rsvp-bg:              #EAE3DB;
  --rsvp-input-bg:        #F5F1ED;
  --rsvp-input-border:    #CEBDA8;
  --rsvp-label-color:     #435B50;
  --rsvp-success-color:   #435B50;
  --rsvp-btn-bg:          #232C31;
  --rsvp-btn-text:        #EAE3DB;
}


/* ─────────────────────────────────────────────
   15. GALERÍA
   ───────────────────────────────────────────── */
:root {
  --gallery-bg:          #232C31;
  --gallery-placeholder: #435B50;
  --gallery-kicker:      #B2B88A;
  --gallery-title:       #EAE3DB;
}


/* ─────────────────────────────────────────────
   16. HASHTAG / PARALAX
   (sección comentada — vars conservadas)
   ───────────────────────────────────────────── */
:root {
  --hashtag-overlay: rgba(35, 44, 49, 0.60);
  --hashtag-text:    #EAE3DB;
}


/* ─────────────────────────────────────────────
   17. FOOTER
   ───────────────────────────────────────────── */
:root {
  --footer-bg:   #232C31;
  --footer-text: #B2B88A;
}


/* ─────────────────────────────────────────────
   18. BOTÓN DE MÚSICA (flotante)
   ───────────────────────────────────────────── */
:root {
  --music-btn-bg:         rgba(234, 227, 219, 0.92);
  --music-btn-border:     #B2B88A;
  --music-btn-text:       #232C31;
  --music-btn-hover-bg:   #232C31;
  --music-btn-hover-text: #EAE3DB;
}


/* ─────────────────────────────────────────────
   19. BOTONES GLOBALES
   ───────────────────────────────────────────── */
:root {
  --btn-primary-bg:       #232C31;
  --btn-primary-text:     #EAE3DB;
  --btn-secondary-border: #435B50;
  --btn-secondary-text:   #232C31;
}