/*
 * Capa de accesibilidad del tema Dentistas Albacete (WCAG 2.1 AA, la referencia de la norma
 * UNE-EN 301 549). Se carga la última en todo el sitio, detrás de Divi, el plugin del
 * directorio y el resto de hojas del tema. Solo corrige lo que afecta a la accesibilidad.
 * Author: Presencia en internet.
 */

/* 1. Foco visible con contraste de 3:1 como mínimo frente al fondo (1.4.11 y 2.4.7).
      Azul sobre superficies claras; cian sobre las oscuras. */
body.da-brand { --da-focus: #1693a5; }
body.da-brand .dab-footer,
body.da-brand .da-selection-bar,
body.da-brand .da3 > .da-intro,
body.da-brand .da3 > .da3-bottom,
body.da-brand .da3--company > .da3-hero,
body.da-brand .dab-editorial-callout,
body.da-brand:not(.da-dir-v3) .da-company .da-contact,
body.da-brand #moove_gdpr_cookie_info_bar { --da-focus: #26d0cc; }
body.da-brand :focus-visible,
body.da-brand .da3 .da-company-select:has(:focus-visible) { outline-color: var(--da-focus) !important; }
/* Aviso, ventana y botón flotante de cookies (plugin GDPR Cookie Compliance): sus botones no
   marcaban el foco y sus interruptores esconden la casilla real. */
body.da-brand :is(#moove_gdpr_cookie_info_bar, #moove_gdpr_cookie_modal) :is(a, button):focus-visible,
body.da-brand #moove_gdpr_save_popup_settings_button:focus-visible {
    outline: 3px solid var(--da-focus) !important;
    outline-offset: 2px !important;
}
body.da-brand #moove_gdpr_cookie_modal .cookie-switch:has(input:focus-visible) {
    outline: 3px solid var(--da-focus);
    outline-offset: 3px;
    border-radius: 20px;
}

/* 2. Campos de formulario: el borde que los delimita, a 3:1 como mínimo (1.4.11). */
body.da-brand :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="hidden"]):not([type="image"]):not([type="range"]):not([type="color"]), select, textarea) {
    border-color: #658085 !important;
}
body.da-brand :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="hidden"]), select, textarea):focus {
    border-color: var(--da-focus) !important;
}
/* Divi dibuja estos campos sin borde y con un gris casi igual que el fondo. */
body.da-brand #commentform :is(input[type="text"], input[type="email"], input[type="url"], textarea),
body.da-brand .et_pb_contact_form :is(input.input, textarea.input, select) {
    border: 1px solid #658085 !important;
    background-color: #fff;
}

/* 3. Textos de ejemplo dentro de los campos: 4,5:1 (1.4.3). */
body.da-brand :is(input, textarea)::placeholder { color: #546a6d !important; opacity: 1; }
body.da-brand:not(.da-dir-v3) .da-company .da-contact :is(input, textarea)::placeholder { color: #c8dbde !important; }

/* 4. Enlaces dentro de un texto: subrayados, para no depender solo del color (1.4.1). */
body.da-brand :is(main, #main-content) :is(p, dd, td, th, figcaption, blockquote) a:not([class]),
body.da-brand :is(main, #main-content) :is(.entry-content, .post-content, .da-description, .et_pb_text_inner) li a:not([class]) {
    text-decoration-line: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: .18em;
}

/* 5. Diseño anterior del directorio (solo lo ven los visitantes mientras el nuevo no esté
      activado): el aviso «¿Es tu clínica o empresa?» del plugin 0.10 quedaba oscuro sobre oscuro. */
body.da-brand:not(.da-dir-v3) .da-company .da-contact .da-claim { color: #daeaec; }
body.da-brand:not(.da-dir-v3) .da-company .da-contact .da-claim a { color: #aaf0f0; }

/* 6. Quien pide menos movimiento no ve animaciones ni desplazamientos suaves. */
@media (prefers-reduced-motion: reduce) {
    body.da-brand *,
    body.da-brand *::before,
    body.da-brand *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}
/* 0.7.0 · «Leer noticia»: al menos 24 px de alto para pulsar (WCAG 2.2, 2.5.8) */
.da-brand .dab-editorial-read { display: inline-flex; align-items: center; min-height: 24px; }

/* Enlaces de la cabecera (escritorio): al menos 24 px de alto para pulsarlos con comodidad (WCAG 2.5.8). */
@media (min-width: 1101px) { .da-brand .dab-nav > a:not(.dab-nav-cta) { padding-block: 4px; } }

/* 0.8.3 · Vídeos de YouTube con la imagen de FlyingPress: el tema los hace botón (role y tabindex en
   brand.js), así que llevan el foco visible de todo el sitio (2.1.1 y 2.4.7). */
body.da-brand .flying-press-youtube:focus-visible { outline: 3px solid var(--da-focus) !important; outline-offset: 3px; }
