/*
 * SkySkin Contrast Fix v1.0.5
 * Objetivo: contraste consistente dentro de la paleta SkySkin.
 * No modifica estructura, tipografías, header ni footer.
 */

:root {
  --sscf-gold: #B7924B;
  --sscf-burgundy: #633747;
  --sscf-deep-rose: #744054;
  --sscf-ivory: #FFF8F2;
  --sscf-pink: #9B365A;
}

/* Nunca intervenir en zonas aprobadas o elementos interactivos. */
header .sscf-light-box,
header .sscf-gold-box,
header .sscf-dark-box,
footer .sscf-light-box,
footer .sscf-gold-box,
footer .sscf-dark-box,
nav .sscf-light-box,
nav .sscf-gold-box,
nav .sscf-dark-box {
  color: inherit !important;
}

/* Boxes claros: texto borgoña, no negro, no dorado sobre blanco/rosa claro. */
.skyskin-contrast-fix-active .sscf-light-box,
.skyskin-contrast-fix-active .sscf-light-box :is(h1,h2,h3,h4,h5,h6,p,li,small,strong,em,label,blockquote,figcaption) {
  color: var(--sscf-burgundy) !important;
}

.skyskin-contrast-fix-active .sscf-light-box a:not(.elementor-button):not(.wp-element-button):not([class*="button"]):not([class*="btn"]) {
  color: var(--sscf-deep-rose) !important;
}

/* Boxes dorados: texto borgoña profundo para máximo contraste dentro de paleta. */
.skyskin-contrast-fix-active .sscf-gold-box,
.skyskin-contrast-fix-active .sscf-gold-box :is(h1,h2,h3,h4,h5,h6,p,li,small,strong,em,label,blockquote,figcaption),
.skyskin-contrast-fix-active .sscf-gold-box a:not(.elementor-button):not(.wp-element-button):not([class*="button"]):not([class*="btn"]) {
  color: var(--sscf-burgundy) !important;
}

/* Boxes oscuros: sólo se aplica cuando JS detecta contraste insuficiente. */
.skyskin-contrast-fix-active .sscf-dark-box.sscf-needs-light-text,
.skyskin-contrast-fix-active .sscf-dark-box.sscf-needs-light-text :is(h1,h2,h3,h4,h5,h6,p,li,small,strong,em,label,blockquote,figcaption) {
  color: var(--sscf-ivory) !important;
}

.skyskin-contrast-fix-active .sscf-dark-box.sscf-needs-light-text :is(h1,h2,h3,h4,h5,h6) {
  color: var(--sscf-gold) !important;
}

/* HOME HERO: pedido específico. Sólo tipografía; no toca posición, fondo ni geometría. */
body.home.skyskin-contrast-fix-active .sscf-home-hero,
body.home.skyskin-contrast-fix-active .sscf-home-hero :is(h1,h2,h3,h4,h5,h6,p,small,strong,em,label,li) {
  color: var(--sscf-gold) !important;
}

body.home.skyskin-contrast-fix-active .sscf-home-hero a:not(.elementor-button):not(.wp-element-button):not([class*="button"]):not([class*="btn"]):not([role="button"]) {
  color: var(--sscf-gold) !important;
}

/* Los botones conservan sus fondos y reciben texto contrastante sólo si JS los clasifica. */
.skyskin-contrast-fix-active .sscf-button-on-gold {
  color: var(--sscf-burgundy) !important;
}

.skyskin-contrast-fix-active .sscf-button-on-dark {
  color: var(--sscf-ivory) !important;
}

/* Evitar contaminar iconos/logos/SVG/inputs. */
.skyskin-contrast-fix-active :is(svg,path,img,picture,video,input,textarea,select,option) {
  --sscf-protected: 1;
}


/* HOME HERO v1.0.1: baja el H1 bajo el header y lo compone en 2 lineas en desktop. */
body.home.skyskin-contrast-fix-active .sscf-hero-title {
  color: var(--sscf-gold) !important;
  box-sizing: border-box;
  padding-top: 64px !important;
  width: min(1180px, calc(100vw - 110px)) !important;
  max-width: none !important;
  line-height: 1.03 !important;
  position: relative;
  z-index: 2;
}

body.home.skyskin-contrast-fix-active .sscf-hero-title .sscf-title-line {
  display: block;
  color: var(--sscf-gold) !important;
}

@media (min-width: 1200px) {
  body.home.skyskin-contrast-fix-active .sscf-hero-title .sscf-title-line {
    white-space: nowrap;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  body.home.skyskin-contrast-fix-active .sscf-hero-title {
    padding-top: 56px !important;
    width: calc(100vw - 80px) !important;
    font-size: clamp(44px, 5.2vw, 60px) !important;
  }
}

@media (max-width: 767px) {
  body.home.skyskin-contrast-fix-active .sscf-hero-title {
    padding-top: 34px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.home.skyskin-contrast-fix-active .sscf-hero-title .sscf-title-line {
    display: inline;
    white-space: normal;
  }

  body.home.skyskin-contrast-fix-active .sscf-hero-title .sscf-title-line + .sscf-title-line::before {
    content: ' ';
  }
}

/* v1.0.2 - CTA "Evaluá tu caso de forma personalizada".
 * Corrige únicamente el color del título y su texto explicativo según el fondo real.
 * En fondos claros/dorados usa borgoña profundo; en fondos oscuros usa dorado + marfil.
 */
.skyskin-contrast-fix-active .sscf-personalized-title-light,
.skyskin-contrast-fix-active .sscf-personalized-copy-light {
  color: #4A2232 !important;
}

.skyskin-contrast-fix-active .sscf-personalized-title-dark {
  color: var(--sscf-gold) !important;
}

.skyskin-contrast-fix-active .sscf-personalized-copy-dark {
  color: var(--sscf-ivory) !important;
}


/* v1.0.3 - Tratamientos: "La evaluación define el plan" en rosa SkySkin.
 * Override puntual para que no quede dorado sobre fondo rosa claro.
 */
.skyskin-contrast-fix-active .sscf-evaluation-plan-title {
  color: var(--sscf-pink) !important;
}


/* v1.0.4 - OVERRIDE FUERTE para el CTA final de /tratamientos/.
 * La regla general de boxes tenia mayor especificidad que v1.0.3.
 * Estas reglas ganan aun cuando el H2 esta dentro de .sscf-light-box/.sscf-gold-box
 * y cubren wrappers internos de Elementor.
 */
body.skyskin-contrast-fix-active .sscf-evaluation-plan-title,
body.skyskin-contrast-fix-active .sscf-light-box .sscf-evaluation-plan-title,
body.skyskin-contrast-fix-active .sscf-gold-box .sscf-evaluation-plan-title,
body.skyskin-contrast-fix-active .sscf-dark-box .sscf-evaluation-plan-title,
body.skyskin-contrast-fix-active .sscf-evaluation-plan-title *,
body.skyskin-contrast-fix-active .sscf-light-box .sscf-evaluation-plan-title *,
body.skyskin-contrast-fix-active .sscf-gold-box .sscf-evaluation-plan-title * {
  color: #9B365A !important;
  -webkit-text-fill-color: #9B365A !important;
}


/* v1.0.5 - Subtitulo del CTA final de /tratamientos/.
 * Evita dorado sobre rosa claro. Se fuerza borgona profundo de la paleta.
 */
body.skyskin-contrast-fix-active .sscf-evaluation-plan-copy,
body.skyskin-contrast-fix-active .sscf-light-box .sscf-evaluation-plan-copy,
body.skyskin-contrast-fix-active .sscf-gold-box .sscf-evaluation-plan-copy,
body.skyskin-contrast-fix-active .sscf-evaluation-plan-copy * {
  color: #633747 !important;
  -webkit-text-fill-color: #633747 !important;
}
