/*
 * Jatun Mayo global contrast system.
 *
 * Add "seccion-oscura" to an Elementor container with a dark background.
 * Add "seccion-clara" to a nested light card when it needs dark text again.
 */

body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override) {
  --jm-contrast-heading: #fffef9;
  --jm-contrast-text: #d5e0dd;
  --jm-contrast-muted: #b8c9c5;
  --jm-contrast-accent: #35c5c4;
  --jm-contrast-button-bg: #35c5c4;
  --jm-contrast-button-text: #0b2730;
  --jm-contrast-line: rgba(255, 255, 255, 0.28);
  color: var(--jm-contrast-text) !important;
}

body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override)
  :where(h1, h2, h3, h4, h5, h6, .elementor-heading-title, .wp-block-heading) {
  color: var(--jm-contrast-heading) !important;
}

body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override)
  :where(
    p,
    li,
    dt,
    dd,
    blockquote,
    figcaption,
    label,
    small,
    .elementor-widget-text-editor,
    .elementor-icon-list-text,
    .elementor-testimonial-content,
    .elementor-tab-content,
    .elementor-counter-title,
    .elementor-counter-number-wrapper
  ) {
  color: var(--jm-contrast-text) !important;
}

body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override)
  :where(strong, em, b, i) {
  color: inherit !important;
}

body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override)
  :where(
    .jm-eyebrow,
    .jm-month,
    .jm-section-label > span,
    .jm-fit-item > span,
    .jm-process-list li > span,
    .eyebrow,
    .kicker,
    .overline
  ) {
  color: var(--jm-contrast-accent) !important;
}

body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override)
  :where(
    a:not(.elementor-button):not(.wp-block-button__link):not(.jm-button):not([class*="button"]),
    .elementor-icon,
    .elementor-icon-list-icon
  ) {
  color: var(--jm-contrast-accent) !important;
}

body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override) :where(.elementor-icon svg, .elementor-icon-list-icon svg) {
  fill: currentColor !important;
}

body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override)
  :where(
    .elementor-button,
    .wp-block-button__link,
    .jm-button,
    a[class*="button"],
    button[type="submit"],
    input[type="submit"]
  ) {
  color: var(--jm-contrast-button-text) !important;
  background-color: var(--jm-contrast-button-bg) !important;
  border-color: var(--jm-contrast-button-bg) !important;
}

body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override)
  :where(
    .elementor-button,
    .wp-block-button__link,
    .jm-button,
    a[class*="button"],
    button[type="submit"],
    input[type="submit"]
  ):hover {
  color: var(--jm-contrast-button-text) !important;
  background-color: #fffef9 !important;
  border-color: #fffef9 !important;
}

body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override)
  :where(hr, .elementor-divider-separator, .elementor-icon-list-item, .elementor-accordion-item) {
  border-color: var(--jm-contrast-line) !important;
}

body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override)
  :where(input:not([type="submit"]), textarea, select) {
  color: #17322f !important;
  background-color: #fffef9 !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
}

body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override)
  :where(input:not([type="submit"]), textarea)::placeholder {
  color: #687874 !important;
  opacity: 1;
}

/*
 * A light card nested inside a dark section inherits these variables, so the
 * same rules switch its content back to dark readable colors.
 */
body :is(.seccion-oscura, .fondo-oscuro, .dark-section):not(#jm-contrast-override) .seccion-clara {
  --jm-contrast-heading: #17322f;
  --jm-contrast-text: #536762;
  --jm-contrast-muted: #687874;
  --jm-contrast-accent: #167e7e;
  --jm-contrast-button-bg: #17322f;
  --jm-contrast-button-text: #fffef9;
  --jm-contrast-line: rgba(23, 50, 47, 0.18);
  color: var(--jm-contrast-text) !important;
}
