/**
 * Accesibilidad: foco visible y recorrido con teclado (WCAG 2.4.3, 2.4.7, 2.1.1).
 * El tema lo anula con "* { outline: none; }" (redbility.css) y "*:focus-visible { outline: none }" (modales).
 * Solo :focus-visible: al pulsar con el ratón no se muestra. Para volver atrás: quitar el enqueue de "a11y-foco".
 * Color: rojo de enlaces del DDR #9A0C0C (8,64:1 sobre blanco); blanco en zonas oscuras.
 */

:focus-visible { outline: 2px solid #9A0C0C !important; outline-offset: 2px !important; }

/* Elementos ocultos con opacidad o altura 0 seguían en el recorrido del Tabulador: visibility: hidden los saca.
   La visibilidad cambia al final de la transición del tema al cerrar, así que la animación se conserva. */

/* Submenús del menú principal: cerrados (sin .open del JS y sin foco dentro) */
#header .dropdown_subcontent-link:not(.open):not(:focus-within) .subcontent-container { visibility: hidden; }

/* Escritorio: el submenú se despliega al llegar con el teclado (antes solo se abría pasando el ratón) */
@media only screen and (min-width: 1024px) {
    #header .dropdown_subcontent-link:focus-within:before { opacity: .2; }
    #header .dropdown_subcontent-link:focus-within .subcontent-container { height: auto !important; padding: 76px 130px 60px; opacity: 1; border-bottom: 1px solid #efefef; }
    #header .dropdown_subcontent-link:focus-within .subcontent { opacity: 1; }
}
@media only screen and (min-width: 1024px) and (max-width: 1680px) {
    #header .dropdown_subcontent-link:focus-within .subcontent-container { padding: 76px 80px 60px; }
}
@media only screen and (min-width: 1024px) and (max-width: 1600px) {
    #header .dropdown_subcontent-link:focus-within .subcontent-container { padding: 76px 50px 60px; }
}

/* Buscador de la barra superior: plegado mientras la cabecera no tenga .search */
#header:not(.search) .header_bar .header_bar-searcher { visibility: hidden; }

/* Logo y botones de la cabecera compacta (copias de "Área de cliente" / "Hazte inversor"):
   solo visibles (>= 1601px) con la página desplazada */
#header .header_bottom-logo, #header .header_bottom-logo-smart,
#header .header_bottom-private_area, #header .header_bottom-call_to_action { visibility: hidden; }
@media only screen and (min-width: 1601px) {
    #header.scrolled:not(.relative) .header_bottom-logo, #header.scrolled:not(.relative) .header_bottom-logo-smart,
    #header.scrolled:not(.relative) .header_bottom-private_area, #header.scrolled:not(.relative) .header_bottom-call_to_action { visibility: visible; }
}

/* Menú flotante del teléfono: plegado mientras el botón no está abierto */
#click_to_call_button:not(.open) ~ .button-list { visibility: hidden; }

/* Carrusel principal de la portada: contenido de las diapositivas inactivas */
.module-home-header .module-list_element:not(.active) .module-content,
.module-home-header .module-list_element:not(.active) .module-title_container { visibility: hidden; }

/* Copias fijas del menú de producto y del índice del glosario: fuera de pantalla hasta que se muestran al hacer scroll */
.module-product-menu.fixed:not(.visible),
.module-glossary-terms-alphabet.cloned:not(.visible) { visibility: hidden; }

/* Enlace de la CNMV en el pie: medía 0px de alto (el contorno no se veía) */
#footer .footer_bottom-copyright a { display: inline-block; }

/* Contorno blanco sobre fondos oscuros: pie #575757, faldón y módulos marrones (#805B29), menú flotante (#575757),
   módulo destacado con fondo negro. (Medido en las 81 páginas del menú: no hay otras zonas oscuras con elementos enfocables) */
#footer .footer_bottom :focus-visible, #footer .footer_confindence :focus-visible, #footer .footer_confidence-info :focus-visible,
.module.bg03 :focus-visible, .main-buttons :focus-visible, .module-featuredDistributor :focus-visible { outline-color: #FFFFFF !important; }
/* Botones flotantes pegados al borde: el contorno va por dentro, sobre su fondo gris */
.main-buttons :focus-visible { outline-offset: -4px !important; }

/* Menú de producto: los enlaces medían 0px de alto en escritorio (el contorno no se veía) */
.module-product-menu .module-list_link { display: inline-block; }

/* Acordeón: paneles cerrados fuera del recorrido (la visibilidad cambia al terminar el fundido de 0,3s) */
.module-accordion .accordion_list dd:not(.open) { visibility: hidden; transition: height 0.6s cubic-bezier(0.55, 0, 0.1, 1), opacity 0.3s cubic-bezier(0.43, 0.39, 0.23, 1.01) 0s, visibility 0s linear 0.3s; }
/* Botón añadido por js/a11y-teclado.js dentro de cada título <dt>: mismo aspecto que el <dt> */
.module-accordion .accordion_list .a11y-accordion-button { all: inherit; display: block; position: static; width: 100%; margin: 0; padding: 0; border: 0; background: none; cursor: pointer; }

/* Enlace "Saltar al contenido" (WCAG 2.4.1): fuera de la vista hasta que recibe el foco con el teclado */
.a11y-skip-link { position: fixed; left: 16px; top: -200px; z-index: 100000; padding: 14px 22px; background-color: #000000; color: #FFFFFF !important;
    font-family: "Acciona-Bold", Arial, sans-serif; font-size: 13px; line-height: 1.4; letter-spacing: 0.1em; text-transform: uppercase; text-decoration: none; }
.a11y-skip-link:focus { top: 16px; }
/* Destino del salto: recibe el foco por programa (tabindex="-1"); sin contorno alrededor de todo el contenido */
main#content[tabindex="-1"]:focus { outline: none !important; }

/* Campos de texto: el navegador los da por ":focus-visible" también al hacer clic, y el contorno parecía un error de
   validación. Solo se marcan cuando se navega con el teclado (<html class="a11y-teclado">, js/a11y-modales.js);
   al hacer clic queda como el original, con el cursor de texto (2026-10-27) */
html:not(.a11y-teclado) :where(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]),
select, textarea):focus-visible { outline: none !important; }

/* Modales: el foco va al propio diálogo al abrirse (js/a11y-modales.js); sin contorno alrededor de todo el modal */
[role="dialog"][tabindex="-1"]:focus { outline: none !important; }

/* Casillas y radios con pretty-checkbox (formularios legales, votaciones): el <input> real es transparente;
   el foco se muestra en la casilla dibujada (label::before) */
.pretty input:focus-visible ~ .state label::before { outline: 2px solid #9A0C0C; outline-offset: 2px; }

/* Botones de compartir (fichas): el enlace es inline y no envolvía el icono; así el contorno lo rodea */
.share-list_link { display: inline-block; vertical-align: middle; }

/* Enlaces dentro de un texto (WCAG 1.4.1): el color no basta para distinguirlos del texto (dorado/rojo sobre gris < 3:1).
   Subrayado solo en los textos legales de los formularios y en el pie de los formularios de congresos. Propuesta para diseño */
.pretty .state label a, .pretty .legal-text-wrap a, .tl-congresos-footer p a { text-decoration: underline !important; text-underline-offset: 2px; }

/* Pie: el enlace de la página actual (y el hover) va en blanco al 40 % sobre #575757 (2,56:1) → 75 % (4,9:1).
   Forma parte de la propuesta de opacidades pendiente de diseño */
.footer_bottom .link.opacity.active, .noTouchDevice .footer_bottom .link.opacity:hover { opacity: .75; }