/* =Modo dark: fondo de fotocopia gris oscuro
------------------------------------------------------- */

:root {
	--dark-paper: #3c3c3c;
	--dark-panel: #1e1e1e;
	--dark-ink: #ffffff;
}

/* Fondo: imagen de la web (bg-new.webp) */
html body.et_cover_background {
	background-size: contain !important;
	background-repeat: repeat-x !important;
}

html,
body {
	background-color: var(--dark-paper) !important;
	background-image: url("../../../uploads/bg-new.webp") !important;
	background-size: contain !important;
	background-repeat: repeat-x !important;
	background-attachment: fixed !important;
	/* La textura se ve con píxel duro; image-rendering se hereda, así que se restablece en los descendientes (ver más abajo) */
	image-rendering: pixelated;
}

/* Las imágenes de la web vuelven a suavizarse (image-rendering se hereda desde body) */
body * {
	image-rendering: auto !important;
}

/* Contenedores de Divi transparentes para que se vea la fotocopia (incluido el footer, que es una plantilla de Divi) */
#page-container,
#main-content,
#main-header,
#top-header,
#et-top-navigation,
#main-footer,
#footer-widgets,
#footer-bottom,
#et-footer-nav,
footer,
.et-l,
[class*="_tb_footer"],
.et_pb_section,
.et_pb_row,
.et_pb_column,
.et_pb_module,
.et_pb_post,
.et_pb_widget {
	background-color: transparent !important;
}

/* Secciones de las plantillas de Divi (cabecera, cuerpo y pie, p. ej. fichas de artistas): Divi les pone un fondo melocotón con !important */
html body #page-container .et_pb_section,
html body #page-container .et_pb_row,
html body #page-container .et_pb_column,
html body #page-container .et_pb_with_background,
html body #page-container .et_pb_module {
	background-color: transparent !important;
}

/* Líneas y bordes en blanco: las sombras duras negras de Divi (separadores, botones, menús) pasan a blanco.
   El resto de sombras se quitan. */
*,
*::before,
*::after {
	box-shadow: none !important;
}

.et_pb_with_border.et_pb_module,
.cmplz-btn,
.wpcf7-form-control.wpcf7-submit,
.sub-menu,
.et_mobile_menu {
	box-shadow: 5px 5px 0 0 var(--dark-ink) !important;
}

*::before,
*::after,
hr {
	border-color: var(--dark-ink) !important;
}

hr {
	background-color: var(--dark-ink) !important;
	color: var(--dark-ink) !important;
}

/* Todo el texto y los trazos en blanco */
body,
body * {
	color: var(--dark-ink) !important;
	border-color: var(--dark-ink) !important;
}

/* Refuerzo para módulos de Divi con colores propios (tablas de precios, etc.) */
html body #page-container,
html body #page-container * {
	color: var(--dark-ink) !important;
}

html body #page-container .et_pb_button:hover,
html body #page-container button:hover,
html body #page-container input[type="submit"]:hover,
html body #page-container .wpcf7-submit:hover {
	color: var(--dark-paper) !important;
}

body svg,
body svg * {
	fill: var(--dark-ink) !important;
	stroke: var(--dark-ink) !important;
}

a,
a:visited {
	color: var(--dark-ink) !important;
}

/* Submenús desplegables del menú de Divi: misma textura de fotocopia que el fondo, con más especificidad que la de Divi */
html body .et_pb_menu.et_pb_module ul ul,
html body .et_pb_menu.et_pb_module .sub-menu,
html body .et_pb_menu.et_pb_module ul.sub-menu,
html body .et_pb_menu.et_pb_module .et-menu ul,
html body header .et_pb_menu.et_pb_module .nav li ul,
html body header .et_pb_menu.et_pb_module .et_mobile_menu,
html body #mobile_menu1 {
	background-color: var(--dark-paper) !important;
	background-image: url("../../../uploads/bg-new.webp") !important;
	background-size: cover !important;
	background-repeat: no-repeat !important;
}

/* Flecha del desplegable "Altres edicions": Divi carga su fuente de iconos desde producción, que no es accesible en local.
   Se usa la copia local del tema para que el icono se vea y no salga el carácter de respaldo (un "3"). */
/* Fuente de iconos de Divi (flechas de menús, pasafotos, lupa, etc.) desde la copia local del tema */
@font-face {
	font-family: "ETmodules";
	src: url("../../Divi/core/admin/fonts/modules/all/modules.woff") format("woff");
	font-display: block;
}

/* Submenús por encima del contenido de la página */
html body .et_pb_menu.et_pb_module,
html body .et_pb_menu.et_pb_module .nav li ul,
html body .et_pb_menu.et_pb_module .sub-menu {
	z-index: 9999 !important;
}

/* Menús de Divi (módulo de menú y menú móvil): Divi los pinta con selectores más específicos, así que se fuerza aquí */
html body .et_pb_menu.et_pb_module ul li a,
html body .et_pb_menu.et_pb_module ul li a:hover,
html body .et_pb_menu.et_pb_module ul li a:focus,
html body .et_pb_menu a,
html body .et_pb_menu a:hover,
html body .et_pb_menu a:focus,
html body .et_pb_menu li,
html body #mobile_menu1 a,
html body #mobile_menu1 a:hover,
html body #mobile_menu1 li,
html body .et_mobile_menu a,
html body .et_mobile_menu a:hover,
html body .et_mobile_menu li {
	color: var(--dark-ink) !important;
}

a:hover {
	opacity: 0.75;
}

/* Galerías de logos del pie: varias filas y tamaño fijo para que no se solapen */
footer .et_pb_gallery .et_pb_gallery_items,
[class*="_tb_footer"] .et_pb_gallery .et_pb_gallery_items {
	flex-wrap: wrap !important;
	justify-content: center !important;
}

footer .et_pb_gallery .et_pb_gallery_item,
[class*="_tb_footer"] .et_pb_gallery .et_pb_gallery_item {
	min-width: 33.3333% !important;
	max-width: 33.3333% !important;
}

footer .et_pb_gallery img,
[class*="_tb_footer"] .et_pb_gallery img {
	min-width: 0 !important;
	max-width: 110px !important;
	max-height: 60px !important;
	width: auto !important;
	object-fit: contain;
}

/* FAVE un poco más pequeño que el resto de logos de colaboración */
html body footer .et_pb_gallery img[src*="fave.svg"],
html body [class*="_tb_footer"] .et_pb_gallery img[src*="fave.svg"] {
	max-width: 60px !important;
	max-height: 50px !important;
}

/* Terrer Priorat: más pequeño que el resto de logos de colaboración */
html body footer .et_pb_gallery img[src*="Terrer_Priorat"],
html body [class*="_tb_footer"] .et_pb_gallery img[src*="Terrer_Priorat"] {
	max-width: 70px !important;
	max-height: 36px !important;
}

/* FAVE y Museo Flamenco Pop se ven en color */
html body footer .et_pb_gallery img[src*="fave-2026"],
html body [class*="_tb_footer"] .et_pb_gallery img[src*="fave-2026"],
html body footer .et_pb_gallery img[src*="Museo_Flamenco"],
html body [class*="_tb_footer"] .et_pb_gallery img[src*="Museo_Flamenco"] {
	filter: none !important;
}



/* «Amb el suport de»: Generalitat y Ajuntament arriba; Coop 57 y XES abajo */
footer .et_pb_gallery:has(img[src*="cultura-generalitat"]) .et_pb_gallery_item,
[class*="_tb_footer"] .et_pb_gallery:has(img[src*="cultura-generalitat"]) .et_pb_gallery_item {
	min-width: 50% !important;
	max-width: 50% !important;
}

/* Logos de las galerías del pie (suporte y colaboración): siluetas en blanco, como el resto de logos */
footer .et_pb_gallery img,
[class*="_tb_footer"] .et_pb_gallery img {
	filter: brightness(0) invert(1) !important;
}

/* Logo del encabezado: 600 px de ancho (Divi lo fija a 280 px de alto) */
html body img[src*="festival-real-360-logo.svg"] {
	width: 600px !important;
	max-width: 100% !important;
	height: auto !important;
}

/* Logos oscuros pasan a blanco (siluetas monocromas) */
img[src*="logo"] {
	filter: brightness(0) invert(1) !important;
}

/* Botones oscuros: contorno blanco y texto blanco; al pasar el ratón, se invierten */
.et_pb_button,
.et_pb_button:visited,
button,
input[type="submit"],
input[type="button"],
.wpcf7-submit {
	background-color: transparent !important;
	background-image: none !important;
	border: 1px solid var(--dark-ink) !important;
	color: var(--dark-ink) !important;
}

.et_pb_button:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.wpcf7-submit:hover {
	background-color: var(--dark-ink) !important;
	color: var(--dark-paper) !important;
}

/* Iconos de redes sociales: Font Awesome no se carga en la página, así que se dibujan como SVG en blanco */
.fa-brands,
.fab {
	display: inline-block !important;
	width: 26px !important;
	height: 26px !important;
	margin: 0 8px !important;
	font-size: 0 !important;
	background-color: transparent !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: contain !important;
}

.fa-instagram {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' fill-rule='evenodd' d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zm0 2.2A2.8 2.8 0 0 0 4.2 7v10A2.8 2.8 0 0 0 7 19.8h10a2.8 2.8 0 0 0 2.8-2.8V7A2.8 2.8 0 0 0 17 4.2H7zM12 7a5 5 0 1 1 0 10 5 5 0 0 1 0-10zm0 2.2a2.8 2.8 0 1 0 0 5.6 2.8 2.8 0 0 0 0-5.6zM17.4 5.6a1.2 1.2 0 1 1 0 2.4 1.2 1.2 0 0 1 0-2.4z'/%3E%3C/svg%3E") !important;
}

.fa-x-twitter {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M18.2 2.5h3.3l-7.2 8.2 8.5 10.8h-6.6l-5.2-6.8-6 6.8H2.7l7.7-8.8L2.3 2.5h6.8l4.7 6.2 5.4-6.2zm-1.2 18.2h1.8L7.2 4.4H5.2l11.8 16.3z'/%3E%3C/svg%3E") !important;
}

.fa-youtube {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' fill-rule='evenodd' d='M23.5 6.2a3 3 0 0 0-2.1-2.1C19.5 3.6 12 3.6 12 3.6s-7.5 0-9.4.5A3 3 0 0 0 .5 6.2 31 31 0 0 0 0 12a31 31 0 0 0 .5 5.8 3 3 0 0 0 2.1 2.1c1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5a3 3 0 0 0 2.1-2.1A31 31 0 0 0 24 12a31 31 0 0 0-.5-5.8zM9.6 15.6V8.4l6.3 3.6-6.3 3.6z'/%3E%3C/svg%3E") !important;
}

.fa-spotify {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='white'/%3E%3Cpath fill='none' stroke='%231e1e1e' stroke-width='2' stroke-linecap='round' d='M6 9.5c3.8-1.1 8.4-.8 11.8 1.2M6.6 13c3.2-.9 6.8-.6 9.8 1M7 16.4c2.6-.7 5.4-.5 7.9.8'/%3E%3C/svg%3E") !important;
}

/* Campos de formulario */
input,
textarea,
select {
	background-color: transparent !important;
	border: 1px solid var(--dark-ink) !important;
	color: var(--dark-ink) !important;
}

/* Placeholders: el formulario del newsletter los pinta en negro con una regla más específica */
::placeholder,
html body input::placeholder,
html body textarea::placeholder,
html body .form-newsletter form.wpcf7-form input::placeholder,
html body .form-newsletter form.wpcf7-form textarea::placeholder,
html body .form-contacto form.wpcf7-form input::placeholder,
html body .form-contacto form.wpcf7-form textarea::placeholder {
	color: var(--dark-ink) !important;
	opacity: 1;
}

/* Paneles claros (menús desplegables, móvil, cookies) pasan a oscuro */
.et_mobile_menu,
.sub-menu,
#et-top-navigation .nav li ul,
#et-top-navigation .et-menu li ul,
.et_mobile_menu li ul,
.et_overlay,
.cmplz-cookiebanner,
.cmplz-cookiebanner * {
	background-color: var(--dark-panel) !important;
}

.cmplz-cookiebanner {
	border: 1px solid var(--dark-ink) !important;
}

/* Tipografía del sitio: Articulat CF (Adobe Fonts). Los iconos (ETmodules, FontAwesome) mantienen su fuente */
html body,
html body *:not(i):not(.et-pb-icon) {
	font-family: "articulat-cf", sans-serif !important;
}

/* Títulos: Articulat CF en peso 800 */
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6 {
	font-family: "articulat-cf", sans-serif !important;
	font-weight: 800 !important;
	font-style: normal !important;
}

/* Sin cursivas en toda la web */
html body *,
html body *::before,
html body *::after,
html body em,
html body i:not([class*="fa-"]),
html body cite,
html body dfn,
html body address {
	font-style: normal !important;
}

/* Encabezado: menos relleno arriba y abajo para que el contenido no quede tan bajo (el logo mide 600 px de ancho) */
html body .et_pb_section_0_tb_header {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}



/* Distorsión fluida (fr-fluid.js): a la derecha de la ventana, detrás del contenido, sin capturar clics */
.fr-fluid-bg {
	position: fixed;
	top: 0;
	right: 0;
	height: 100vh;
	width: 47vh;
	z-index: 0;
	pointer-events: none;
	opacity: 0.18;
	/* El negro del script se funde con el fondo: modo pantalla, sin fondo propio */
	background: transparent !important;
	mix-blend-mode: screen;
}

/* Home: sin la imagen de la caracola; la sección conserva su espacio */
body:is(.page-id-72, .page-id-470) .et_pb_section_0.et_pb_with_background {
	background-image: none !important;
}

/* Menú hamburguesa (móvil): las líneas en blanco */
html body .mobile_menu_bar::before,
html body .mobile_menu_bar::after,
html body .mobile_menu_bar {
	color: #fff !important;
}

/* Home: los separadores de la lista ocupan la mitad de la columna, como en el programa original */
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_module.et_pb_divider {
	width: 50% !important;
	max-width: 50% !important;
}

/* Home (lista del programa): tamaños como en el programa original. Articulat CF se ve más pequeña a igual tamaño */
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text h2 {
	font-size: 46px !important;
}
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text p {
	font-size: 22px !important;
}

/* Home: cabecera con el mismo espacio vertical y menú en mayúsculas que el resto de páginas (logo grande) */
body:is(.page-id-72, .page-id-470) .et_pb_row_0_tb_header {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
body:is(.page-id-72, .page-id-470) .et_pb_row_1_tb_header {
	padding-top: 0 !important;
}
body:is(.page-id-72, .page-id-470) .et_pb_menu_0_tb_header .nav li a,
body:is(.page-id-72, .page-id-470) .et_pb_menu_0_tb_header .nav li a:hover {
	text-transform: uppercase !important;
}

/* Home: ajuste fino de la cabecera para coincidir con /artistes/ */
body:is(.page-id-72, .page-id-470) .et_pb_menu_0_tb_header {
	margin-bottom: 0 !important;
}
body:is(.page-id-72, .page-id-470) .et_pb_row_1_tb_header {
	padding-top: 28px !important;
}

/* Home: barra superior con el mismo marco y altura que en el resto de páginas */
body:is(.page-id-72, .page-id-470) .et_pb_divider_0_tb_header {
	border: 1px solid #fff !important;
	border-radius: 1px !important;
	height: 16px !important;
	box-sizing: border-box !important;
}

/* Home: sin la línea interior que dibuja Divi en el divisor de la cabecera */
body:is(.page-id-72, .page-id-470) .et_pb_divider_0_tb_header::before {
	display: none !important;
}

/* Home (lista del programa): cada bloque con la misma secuencia y espacios: texto, línea, título grande, texto */
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text h2 {
	margin: 0 0 0.5em !important;
}
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text p {
	margin: 0 !important;
}

/* Home (lista): cada bloque es nota (encima), línea, título y fecha. Módulos de texto de la sección 0: 0 nota de Festival Real 360º, 1-2 La Puebla, 3 Festival Poetas, 4 nombres por confirmar, después notas en 5+3k, títulos en 6+3k y fechas en 7+3k */
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_0,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_3,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_5,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_8,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_11,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_14,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_17 {
	margin-top: 84px !important;
	margin-bottom: 0 !important;
}
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_1,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_4 {
	margin-top: 0 !important;
	margin-bottom: 8px !important;
}
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_2 {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_6,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_9,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_12,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_15,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_18 {
	margin-top: 0 !important;
	margin-bottom: 8px !important;
}
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_7,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_10,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_13,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_16,
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text_19 {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_divider {
	margin-bottom: 0 !important;
}

/* Home (lista): Divi añade padding y margen a los títulos; se quitan para que el espaciado sea el de cada bloque */
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_text h2 {
	padding: 0 !important;
	margin-bottom: 0 !important;
}

/* Home: logo y barra alineados a la izquierda como en el resto de páginas, y la lista más cerca del logo */
body:is(.page-id-72, .page-id-470) .et_pb_section_0 {
	padding-top: 0 !important;
}
body:is(.page-id-72, .page-id-470) .et_pb_row_1_tb_header {
	padding-bottom: 0 !important;
}

/* Home: el logo va sangrado como en las otras páginas (28 px respecto a la barra) */
body:is(.page-id-72, .page-id-470) .et_pb_section_0_tb_header .et_pb_image_0_tb_header {
	padding-left: 28px !important;
}
body:is(.page-id-72, .page-id-470) .et_pb_section_0_tb_header .et_pb_image_0_tb_header img {
	margin-left: 0 !important;
	margin-top: 10px !important;
}

/* Home: el contenido empieza a la misma altura bajo el logo que en las otras páginas (89 px) */
body:is(.page-id-72, .page-id-470) .et_pb_section_0 {
	margin-top: -25px !important;
}

/* Columnas de la izquierda (primera columna de cada fila) sin padding, en todas las páginas menos la home */
body:not(.page-id-72) .et_pb_row > .et_pb_column:first-child {
	padding: 0 !important;
}

/* Todas las columnas (también las de la derecha, de texto) sin padding, en todas las páginas menos la home */
body:not(.page-id-72) .et_pb_row > .et_pb_column {
	padding: 0 !important;
}

/* Home (lista): títulos de artista con enlace; al pasar el ratón se subrayan */
body:is(.page-id-72, .page-id-470) .et_pb_section_0 h2 a {
	color: #fff !important;
	text-decoration: none !important;
	transition: opacity .2s ease;
}
body:is(.page-id-72, .page-id-470) .et_pb_section_0 h2 a:hover {
	text-decoration: none !important;
	opacity: .75;
}

/* Home: la lista vuelve a alinearse con la barra (sin el padding izquierdo de la fila) */
body:is(.page-id-72, .page-id-470) .et_pb_section_0 .et_pb_row_0 {
	padding-left: 0 !important;
}
