/* ==========================================================
   Florida Premier Cardiology
   Estilos globales versionados - VTL Solutions - 25 ago 2026

   Tema claro en todo el sitio menos la homepage, que ya estaba
   hecha. Header, barra superior y footer quedan navy en todas.

   Migrado desde WordPress Additional CSS (post 5520).
   ========================================================== */


/* ---------- 1. TEMA CLARO ----------
   Alcance: todas las paginas menos home (page-id-5312) y todos
   los posts del blog. Excluye por construccion el header
   (.sticky), el footer de paginas (.bg-dark-navy) y el footer
   de posts (.bg-[#152238]). */

body.page:not(.page-id-5312) section.bg-background,
body.page:not(.page-id-5312) section[class*="color-dark-navy"],
body.page:not(.page-id-5312) section.bg-slate-950:not(.sticky),
body.single-post section.bg-slate-950:not(.sticky) {
  --background:#ffffff; --foreground:#0f172a;
  --card:#ffffff; --card-foreground:#0f172a;
  --popover:#ffffff; --popover-foreground:#0f172a;
  --muted:#f1f5f9; --muted-foreground:#475569;
  --accent:#f1f5f9; --accent-foreground:#0f172a;
  --secondary:#f1f5f9; --secondary-foreground:#0f172a;
  --border:#e2e8f0; --input:#e2e8f0;
  background-color:#ffffff !important;
  color:#0f172a !important;
}

/* Texto principal. :not([class*="bg-"]) deja fuera los botones. */
body.page:not(.page-id-5312) section.bg-background :not([class*="bg-"]):is(.text-white,.text-slate-100,.text-slate-200,.text-gray-100,.text-gray-200),
body.page:not(.page-id-5312) section[class*="color-dark-navy"] :not([class*="bg-"]):is(.text-white,.text-slate-100,.text-slate-200,.text-gray-100,.text-gray-200),
body.page:not(.page-id-5312) section.bg-slate-950:not(.sticky) :not([class*="bg-"]):is(.text-white,.text-slate-100,.text-slate-200,.text-gray-100,.text-gray-200),
body.single-post section.bg-slate-950:not(.sticky) :not([class*="bg-"]):is(.text-white,.text-slate-100,.text-slate-200,.text-gray-100,.text-gray-200) {
  color:#0f172a !important;
}

/* Texto secundario */
body.page:not(.page-id-5312) section.bg-background :is(.text-slate-300,.text-slate-400,.text-gray-300,.text-gray-400),
body.page:not(.page-id-5312) section[class*="color-dark-navy"] :is(.text-slate-300,.text-slate-400,.text-gray-300,.text-gray-400),
body.page:not(.page-id-5312) section.bg-slate-950:not(.sticky) :is(.text-slate-300,.text-slate-400,.text-gray-300,.text-gray-400),
body.single-post section.bg-slate-950:not(.sticky) :is(.text-slate-300,.text-slate-400,.text-gray-300,.text-gray-400) {
  color:#475569 !important;
}

/* Texto e iconos en rojo Tailwind (#FB2C36: 3.81:1 sobre blanco) */
body.page:not(.page-id-5312) section.bg-background :is(.text-red-400,.text-red-500,.text-red-600,.fill-red-400,.fill-red-500,.fill-red-600),
body.page:not(.page-id-5312) section[class*="color-dark-navy"] :is(.text-red-400,.text-red-500,.text-red-600,.fill-red-400,.fill-red-500,.fill-red-600),
body.page:not(.page-id-5312) section.bg-slate-950:not(.sticky) :is(.text-red-400,.text-red-500,.text-red-600,.fill-red-400,.fill-red-500,.fill-red-600),
body.single-post section.bg-slate-950:not(.sticky) :is(.text-red-400,.text-red-500,.text-red-600,.fill-red-400,.fill-red-500,.fill-red-600) {
  color:#A32D2D !important;
  fill:#A32D2D !important;
}

/* Tarjetas oscuras */
body.page:not(.page-id-5312) section.bg-background :is(.bg-slate-800,.bg-slate-900,.bg-slate-950),
body.page:not(.page-id-5312) section[class*="color-dark-navy"] :is(.bg-slate-800,.bg-slate-900,.bg-slate-950),
body.page:not(.page-id-5312) section.bg-slate-950:not(.sticky) :is(.bg-slate-800,.bg-slate-900,.bg-slate-950),
body.single-post section.bg-slate-950:not(.sticky) :is(.bg-slate-800,.bg-slate-900,.bg-slate-950) {
  background-color:#ffffff !important;
}

/* Bordes oscuros */
body.page:not(.page-id-5312) section.bg-background :is(.border-slate-700,.border-slate-800,.border-slate-900),
body.page:not(.page-id-5312) section[class*="color-dark-navy"] :is(.border-slate-700,.border-slate-800,.border-slate-900),
body.page:not(.page-id-5312) section.bg-slate-950:not(.sticky) :is(.border-slate-700,.border-slate-800,.border-slate-900),
body.single-post section.bg-slate-950:not(.sticky) :is(.border-slate-700,.border-slate-800,.border-slate-900) {
  border-color:#e2e8f0 !important;
}

/* Campos de formulario */
body.page:not(.page-id-5312) section.bg-background :is(input,select,textarea),
body.page:not(.page-id-5312) section[class*="color-dark-navy"] :is(input,select,textarea),
body.page:not(.page-id-5312) section.bg-slate-950:not(.sticky) :is(input,select,textarea),
body.single-post section.bg-slate-950:not(.sticky) :is(input,select,textarea) {
  background-color:#ffffff !important;
  color:#0f172a !important;
  border-color:#cbd5e1 !important;
}


/* ---------- 2. ROJO DE MARCA ----------
   #A32D2D, el del boton del header de la homepage.
   Sustituye a #EF4343 (3.78:1 con blanco, no cumple AA). */

html.dark, :root, .light {
  --primary: #A32D2D;
  --destructive: #A32D2D;
}

.bg-red-500, .bg-red-600, .bg-red-700 { background-color:#A32D2D !important; }
.border-red-500, .border-red-600 { border-color:#A32D2D !important; }

#fpc-sticky-appt-bar { border-top-color:#A32D2D !important; }
#fpc-lang-trigger { border-color:#A32D2D !important; }
.fpc-sticky-btn { background-color:#A32D2D !important; }

/* Todo boton rojo lleva letras blancas. [class] repetido para
   ganarle en especificidad a las reglas de texto del bloque 1. */
body.page:not(.page-id-5312) section[class][class].bg-background :is(a,button)[class*="bg-primary"][class],
body.page:not(.page-id-5312) section[class][class].bg-background :is(a,button)[class*="bg-primary"][class] *,
body.page:not(.page-id-5312) section[class][class].bg-background :is(a,button)[class*="bg-red"][class],
body.page:not(.page-id-5312) section[class][class].bg-background :is(a,button)[class*="bg-red"][class] *,
body.page:not(.page-id-5312) section[class][class].bg-background :is(a,button)[class*="bg-destructive"][class],
body.page:not(.page-id-5312) section[class][class].bg-background :is(a,button)[class*="bg-destructive"][class] *,
body.page:not(.page-id-5312) section[class][class][class*="color-dark-navy"] :is(a,button)[class*="bg-primary"][class],
body.page:not(.page-id-5312) section[class][class][class*="color-dark-navy"] :is(a,button)[class*="bg-primary"][class] *,
body.page:not(.page-id-5312) section[class][class][class*="color-dark-navy"] :is(a,button)[class*="bg-red"][class],
body.page:not(.page-id-5312) section[class][class][class*="color-dark-navy"] :is(a,button)[class*="bg-red"][class] *,
body.page:not(.page-id-5312) section[class][class][class*="color-dark-navy"] :is(a,button)[class*="bg-destructive"][class],
body.page:not(.page-id-5312) section[class][class][class*="color-dark-navy"] :is(a,button)[class*="bg-destructive"][class] *,
body.page:not(.page-id-5312) section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-primary"][class],
body.page:not(.page-id-5312) section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-primary"][class] *,
body.page:not(.page-id-5312) section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-red"][class],
body.page:not(.page-id-5312) section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-red"][class] *,
body.page:not(.page-id-5312) section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-destructive"][class],
body.page:not(.page-id-5312) section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-destructive"][class] *,
body.single-post section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-primary"][class],
body.single-post section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-primary"][class] *,
body.single-post section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-red"][class],
body.single-post section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-red"][class] *,
body.single-post section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-destructive"][class],
body.single-post section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-destructive"][class] * {
  color:#ffffff !important;
}

/* El boton de enviar usa dark:bg-destructive/60 y con html.dark
   activo salia rosa palido sobre fondo claro (3.16:1). Se fuerza
   el rojo solido: 7.07:1. */
body.page:not(.page-id-5312) section[class][class].bg-background :is(a,button)[class*="bg-destructive"][class],
body.page:not(.page-id-5312) section[class][class][class*="color-dark-navy"] :is(a,button)[class*="bg-destructive"][class],
body.page:not(.page-id-5312) section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-destructive"][class],
body.single-post section[class][class].bg-slate-950:not(.sticky) :is(a,button)[class*="bg-destructive"][class] {
  background-color:#A32D2D !important;
}

/* ---------- 3. HEADER ----------
   Las internas usaban un header distinto al de la homepage:
   menu casi negro y barra superior oscura. Se igualan. */

section.sticky.top-0.z-50 {
  background-color:#152238 !important;
}

section.sticky.top-0.z-50 .bg-slate-900 {
  background-color:#F1F5F9 !important;
  color:#152238 !important;
  border-bottom:1px solid #E2E8F0;
}

section.sticky.top-0.z-50 .bg-slate-900 a,
section.sticky.top-0.z-50 .bg-slate-900 svg {
  color:#152238 !important;
}

section.sticky.top-0.z-50 .bg-slate-900 a[class*="bg-red"],
section.sticky.top-0.z-50 .bg-slate-900 a[class*="bg-red"] * {
  color:#ffffff !important;
}


/* ---------- 4. FOOTER ----------
   bg-dark-navy no estaba definida en el tema. */

.bg-dark-navy { background-color:#152238 !important; }


/* ---------- 5. PADDING ----------
   40px / 56px fijo en todas las secciones de contenido.
   Solo desde 768px: en movil ya era menor. Home no se toca. */

@media (min-width: 768px) {
  body.page:not(.page-id-5312) section.bg-background,
  body.page:not(.page-id-5312) section[class*="color-dark-navy"],
  body.page:not(.page-id-5312) section.bg-slate-950:not(.sticky),
  body.single-post section.bg-slate-950:not(.sticky) {
    padding-top: 40px !important;
    padding-bottom: 56px !important;
  }
}


/* ---------- 6. PAGINAS SIN BUILDER ----------
   Paginas con la plantilla estandar del tema (privacidad, y
   cualquier otra creada fuera del WVC Editor). No tienen las
   clases de seccion del bloque 1, asi que caian en el fondo
   oscuro del body. */

body.page:not(.page-id-5312) main.site-main,
body.page:not(.page-id-5312) main.site-main article.page {
  background-color:#ffffff !important;
  color:#0f172a !important;
}

body.page:not(.page-id-5312) main.site-main :is(h1,h2,h3,h4,h5,p,li,td,th,dt,dd,blockquote) {
  color:#0f172a !important;
}

body.page:not(.page-id-5312) main.site-main .entry-content a {
  color:#A32D2D !important;
  text-decoration:underline;
}

@media (min-width: 768px) {
  body.page:not(.page-id-5312) main.site-main article.page {
    padding: 40px 48px 56px;
  }
}


/* ---------- 7. CABECERA DE PAGINA SIN BUILDER ----------
   La banda del titulo (.page-header) venia en #272B35 y con el
   bloque 6 el texto paso a oscuro: oscuro sobre oscuro. */

body.page:not(.page-id-5312) main.site-main .page-header {
  background-color:#F1F5F9 !important;
  border-bottom:1px solid #E2E8F0;
}

body.page:not(.page-id-5312) main.site-main .page-title {
  color:#152238 !important;
}


/* ---------- 8. COLUMNA VACIA ----------
   La plantilla estandar usa una grilla de 2 columnas para una
   barra lateral que no existe (0 widgets), dejando 362px vacios.
   Se pasa a una sola columna. */

body.page:not(.page-id-5312) main.site-main .content-layout--with-sidebar {
  grid-template-columns: 1fr !important;
}

body.page:not(.page-id-5312) main.site-main .entry-content {
  max-width: 78ch;
}


/* ---------- 9. NAVY UNIFICADO ----------
   La barra sticky inferior usaba 0F172A.
   Header, footer y barra ahora comparten 152238. */

[class*="bg-[#0f172a]"],
[class*="bg-[#0F172A]"] {
  background-color: #152238 !important;
}


/* ---------- 10. MENU UNIFICADO ----------
   El header de la home se recompilo con text-[16px] y el de las
   demas paginas quedo en text-[11px]. Mismo markup, distinto
   build. Se iguala al de la home. */

[data-slot="navigation-menu-link"].text-\[11px\] {
  font-size: 16px !important;
}


/* ---------- 11. UN SOLO TELEFONO EN LA BARRA ----------
   Las paginas que no son home traen el header del build viejo,
   con un chip por ubicacion y el telefono repetido. Se oculta
   el primero para que quede como en la home: las dos ubicaciones
   y el telefono una sola vez al final. */

section.sticky.top-0.z-50 .bg-slate-900 > div > div:first-child > a[href^="tel:"] {
  display: none !important;
}

/* El chip de Delray queda con una sola linea; se alinea arriba
   para que su etiqueta quede a la misma altura que la de Boynton. */

section.sticky.top-0.z-50 .bg-slate-900 > div > div:first-child {
  align-self: flex-start !important;
}


/* ---------- 12. TITULOS EN NAVY ----------
   La home ya usa text-[#152238] en los titulos de seccion; las
   demas paginas heredaban el #0F172A del token. Se igualan al
   navy del footer. Solo titulos que usan el token de texto:
   los que traen su propio color (rojo de marca, blanco sobre
   fondo oscuro) no se tocan. */

body.page:not(.page-id-5312) section.bg-background :is(h1,h2,h3,h4).text-foreground,
body.page:not(.page-id-5312) section[class*="color-dark-navy"] :is(h1,h2,h3,h4).text-foreground,
body.page:not(.page-id-5312) section.bg-slate-950:not(.sticky) :is(h1,h2,h3,h4).text-foreground,
body.single-post section.bg-slate-950:not(.sticky) :is(h1,h2,h3,h4).text-foreground {
  color: #152238 !important;
}


/* ---------- 13. TAMANO DE TITULO DE PAGINA ----------
   La referencia es el H1 de /services/, 48px desde 768px.
   Blog y Reviews estaban en 64px, Patient Information en 60px
   y About en 72px. Se igualan los cuatro. Movil no se toca:
   ahi cada uno usa su escala responsive. */

@media (min-width: 768px) {
  h2.font-default.font-black.text-foreground.leading-\[0\.92\],
  h2.font-default.text-white.leading-\[1\.1\].tracking-tighter.font-bold,
  h2.font-default.font-bold.uppercase.leading-\[0\.9\],
  h2.font-default.font-bold.leading-\[1\].tracking-tighter.max-w-4xl {
    font-size: 48px !important;
  }
}