/* ══════════════════════════════════════════════════════════
   LIRAMAR — SISTEMA DE TEMAS
   Tema 1 (elegante): estilos base en los HTML, sin overrides
   Tema 2 (clasico):  inspirado en liramarmejia.com actual
   Tema 3 (playa):    minimalista playero
   ══════════════════════════════════════════════════════════ */


/* ────────────────────────────────────────────────────────
   TEMA 2: CLÁSICO
   Azul corporativo · Teal · Poppins · Fondos blancos
   ──────────────────────────────────────────────────────── */

/* Section backgrounds */
html[data-theme="clasico"] .bg-sand-100 { background-color: #FFFFFF; }
html[data-theme="clasico"] .bg-sand-200 { background-color: #EDF5FA; }
html[data-theme="clasico"] .bg-navy     { background-color: #1A3C58; }

/* Nav background (interior pages have bg-navy/95 class) */
html[data-theme="clasico"] .bg-navy\/95 { background-color: rgba(26,60,88,0.97); }

/* Hero overlays */
html[data-theme="clasico"] .bg-navy\/60 { background-color: rgba(26,60,88,0.60); }
html[data-theme="clasico"] .bg-navy\/55 { background-color: rgba(26,60,88,0.55); }
html[data-theme="clasico"] .bg-navy\/50 { background-color: rgba(26,60,88,0.50); }
html[data-theme="clasico"] .bg-navy\/40 { background-color: rgba(26,60,88,0.40); }
html[data-theme="clasico"] .bg-navy\/25 { background-color: rgba(26,60,88,0.25); }
html[data-theme="clasico"] .bg-navy\/20 { background-color: rgba(26,60,88,0.20); }
html[data-theme="clasico"] .bg-navy\/10 { background-color: rgba(26,60,88,0.10); }
html[data-theme="clasico"] .bg-navy\/5  { background-color: rgba(26,60,88,0.05); }

/* Text */
html[data-theme="clasico"] .text-navy      { color: #1A3C58; }
html[data-theme="clasico"] .text-gold      { color: #0095B0; }
html[data-theme="clasico"] .text-navy\/70  { color: rgba(26,60,88,0.70); }
html[data-theme="clasico"] .text-navy\/60  { color: rgba(26,60,88,0.60); }
html[data-theme="clasico"] .text-navy\/50  { color: rgba(26,60,88,0.50); }
html[data-theme="clasico"] .text-navy\/40  { color: rgba(26,60,88,0.40); }
html[data-theme="clasico"] .text-navy\/30  { color: rgba(26,60,88,0.30); }
html[data-theme="clasico"] .text-gold\/80  { color: rgba(0,149,176,0.80); }
html[data-theme="clasico"] .text-gold\/70  { color: rgba(0,149,176,0.70); }
html[data-theme="clasico"] .text-gold\/60  { color: rgba(0,149,176,0.60); }
html[data-theme="clasico"] .text-gold\/50  { color: rgba(0,149,176,0.50); }

/* Borders */
html[data-theme="clasico"] .border-gold      { border-color: #0095B0; }
html[data-theme="clasico"] .border-gold\/60  { border-color: rgba(0,149,176,0.60); }
html[data-theme="clasico"] .border-gold\/40  { border-color: rgba(0,149,176,0.40); }
html[data-theme="clasico"] .border-gold\/30  { border-color: rgba(0,149,176,0.30); }
html[data-theme="clasico"] .border-gold\/20  { border-color: rgba(0,149,176,0.20); }
html[data-theme="clasico"] .border-navy\/20  { border-color: rgba(26,60,88,0.20); }
html[data-theme="clasico"] .border-navy\/10  { border-color: rgba(26,60,88,0.10); }

/* Hover borders/text */
html[data-theme="clasico"] .hover\:border-gold:hover { border-color: #0095B0; }
html[data-theme="clasico"] .hover\:text-gold:hover   { color: #0095B0; }

/* BG accent */
html[data-theme="clasico"] .bg-gold     { background-color: #0095B0; }
html[data-theme="clasico"] .bg-gold\/20 { background-color: rgba(0,149,176,0.20); }

/* Gradient froms (hero overlays) */
html[data-theme="clasico"] .from-navy { --tw-gradient-from: #1A3C58; }
html[data-theme="clasico"] .via-navy\/50 { --tw-gradient-stops: var(--tw-gradient-from), rgba(26,60,88,0.5), var(--tw-gradient-to, transparent); }

/* Custom CSS component classes */
html[data-theme="clasico"] .btn-primary            { background: #0095B0 !important; color: #FFFFFF !important; }
html[data-theme="clasico"] .btn-primary::before    { background: #007389 !important; }
html[data-theme="clasico"] .btn-outline            { border-color: #0095B0 !important; color: #0095B0 !important; }
html[data-theme="clasico"] .btn-outline::before    { background: #0095B0 !important; }
html[data-theme="clasico"] .btn-outline:hover      { color: #FFFFFF !important; }
html[data-theme="clasico"] .section-subtitle       { color: #0095B0 !important; }
html[data-theme="clasico"] .section-title          { color: #1A3C58 !important; font-family: 'Poppins', sans-serif !important; font-weight: 600 !important; }
html[data-theme="clasico"] .gold-line::before      { background: #0095B0 !important; }
html[data-theme="clasico"] #grain                  { opacity: 0 !important; }

/* Typography — Poppins para headings */
html[data-theme="clasico"] .font-display {
  font-family: 'Poppins', sans-serif !important;
}
html[data-theme="clasico"] h1.font-display,
html[data-theme="clasico"] h2.font-display,
html[data-theme="clasico"] h3.font-display {
  font-family: 'Poppins', sans-serif !important;
  font-style: normal !important;
}
html[data-theme="clasico"] em.italic {
  font-family: 'Poppins', sans-serif !important;
  font-style: italic !important;
  color: #0095B0;
}
/* Forzar title italic gold → teal */
html[data-theme="clasico"] em.text-gold,
html[data-theme="clasico"] em.italic.text-gold { color: #0095B0 !important; }

/* Expanding line on boulevard cards */
html[data-theme="clasico"] .group:hover .group-hover\:bg-gold\/50 { background-color: rgba(0,149,176,0.50); }
html[data-theme="clasico"] .bg-gold\/20 { background-color: rgba(0,149,176,0.20); }


/* ────────────────────────────────────────────────────────
   TEMA 3: PLAYA MINIMALISTA
   Arena cálida · Terracota · Raleway · Tipografía ligera
   ──────────────────────────────────────────────────────── */

html[data-theme="playa"] .bg-sand-100 { background-color: #FFFBF5; }
html[data-theme="playa"] .bg-sand-200 { background-color: #F5EDE0; }
html[data-theme="playa"] .bg-navy     { background-color: #2D3B35; }

html[data-theme="playa"] .bg-navy\/95 { background-color: rgba(45,59,53,0.97); }
html[data-theme="playa"] .bg-navy\/60 { background-color: rgba(45,59,53,0.60); }
html[data-theme="playa"] .bg-navy\/55 { background-color: rgba(45,59,53,0.55); }
html[data-theme="playa"] .bg-navy\/50 { background-color: rgba(45,59,53,0.50); }
html[data-theme="playa"] .bg-navy\/40 { background-color: rgba(45,59,53,0.40); }
html[data-theme="playa"] .bg-navy\/25 { background-color: rgba(45,59,53,0.25); }
html[data-theme="playa"] .bg-navy\/20 { background-color: rgba(45,59,53,0.20); }
html[data-theme="playa"] .bg-navy\/10 { background-color: rgba(45,59,53,0.10); }
html[data-theme="playa"] .bg-navy\/5  { background-color: rgba(45,59,53,0.05); }

html[data-theme="playa"] .text-navy      { color: #2D3B35; }
html[data-theme="playa"] .text-gold      { color: #D4775A; }
html[data-theme="playa"] .text-navy\/70  { color: rgba(45,59,53,0.70); }
html[data-theme="playa"] .text-navy\/60  { color: rgba(45,59,53,0.60); }
html[data-theme="playa"] .text-navy\/50  { color: rgba(45,59,53,0.50); }
html[data-theme="playa"] .text-navy\/40  { color: rgba(45,59,53,0.40); }
html[data-theme="playa"] .text-navy\/30  { color: rgba(45,59,53,0.30); }
html[data-theme="playa"] .text-gold\/80  { color: rgba(212,119,90,0.80); }
html[data-theme="playa"] .text-gold\/70  { color: rgba(212,119,90,0.70); }
html[data-theme="playa"] .text-gold\/60  { color: rgba(212,119,90,0.60); }
html[data-theme="playa"] .text-gold\/50  { color: rgba(212,119,90,0.50); }

html[data-theme="playa"] .border-gold      { border-color: #D4775A; }
html[data-theme="playa"] .border-gold\/60  { border-color: rgba(212,119,90,0.60); }
html[data-theme="playa"] .border-gold\/40  { border-color: rgba(212,119,90,0.40); }
html[data-theme="playa"] .border-gold\/30  { border-color: rgba(212,119,90,0.30); }
html[data-theme="playa"] .border-gold\/20  { border-color: rgba(212,119,90,0.20); }
html[data-theme="playa"] .border-navy\/20  { border-color: rgba(45,59,53,0.20); }
html[data-theme="playa"] .border-navy\/10  { border-color: rgba(45,59,53,0.10); }

html[data-theme="playa"] .hover\:border-gold:hover { border-color: #D4775A; }
html[data-theme="playa"] .hover\:text-gold:hover   { color: #D4775A; }

html[data-theme="playa"] .bg-gold     { background-color: #D4775A; }
html[data-theme="playa"] .bg-gold\/20 { background-color: rgba(212,119,90,0.20); }

html[data-theme="playa"] .from-navy { --tw-gradient-from: #2D3B35; }
html[data-theme="playa"] .via-navy\/50 { --tw-gradient-stops: var(--tw-gradient-from), rgba(45,59,53,0.5), var(--tw-gradient-to, transparent); }

html[data-theme="playa"] .btn-primary            { background: #D4775A !important; color: #FFFFFF !important; }
html[data-theme="playa"] .btn-primary::before    { background: #B85C40 !important; }
html[data-theme="playa"] .btn-outline            { border-color: #D4775A !important; color: #D4775A !important; }
html[data-theme="playa"] .btn-outline::before    { background: #D4775A !important; }
html[data-theme="playa"] .btn-outline:hover      { color: #FFFFFF !important; }
html[data-theme="playa"] .section-subtitle       { color: #D4775A !important; }
html[data-theme="playa"] .section-title          { color: #2D3B35 !important; font-family: 'Raleway', sans-serif !important; font-weight: 300 !important; }
html[data-theme="playa"] .gold-line::before      { background: #D4775A !important; }
html[data-theme="playa"] #grain                  { opacity: 0.015 !important; }

html[data-theme="playa"] .font-display {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 300 !important;
}
html[data-theme="playa"] h1.font-display,
html[data-theme="playa"] h2.font-display,
html[data-theme="playa"] h3.font-display {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 300 !important;
  font-style: normal !important;
}
html[data-theme="playa"] em.italic {
  font-family: 'Raleway', sans-serif !important;
  font-style: italic !important;
  color: #D4775A;
}
html[data-theme="playa"] em.text-gold,
html[data-theme="playa"] em.italic.text-gold { color: #D4775A !important; }

/* Lot card backgrounds for playa theme */
html[data-theme="playa"] .bg-emerald-50  { background-color: #F0FBF5; }
html[data-theme="playa"] .bg-amber-50    { background-color: #FFF8F0; }

/* Boulevard expanding line */
html[data-theme="playa"] .group:hover .group-hover\:bg-gold\/50 { background-color: rgba(212,119,90,0.50); }
