/*
 * Ajustes globales del tema hijo · Clínica Dental Ziortza Ugarte (30/09/2026)
 * Divi pone overflow:hidden en #page-container y body, lo que anula position:sticky
 * (imágenes que se quedan fijas junto al texto). overflow-x:clip recorta igual sin romper sticky.
 */
#page-container { overflow: visible !important; overflow-x: clip !important; }
body { overflow-x: clip !important; }

/*
 * Botones (30/09/2026, Lighthouse): Divi anima "all" (padding, tamaño de letra, bordes, radios...)
 * y al cargar la página esas transiciones se disparaban en ~27 botones a la vez (trabajo de layout
 * que sube el TBT). Solo se animan las propiedades que cambian en el hover de los presets.
 */
body .et_pb_button,
body .et_pb_button:hover {
  transition-property: background-color, color, border-color, box-shadow, transform, opacity !important;
}

/* Cintas en movimiento arrastrables (js/zu-marquee.js, 30/09/2026): mano al pasar, sin seleccionar texto
 * ni arrastrar imágenes; en móvil el gesto vertical sigue desplazando la página. */
.zu-marquee-js { cursor: grab; touch-action: pan-y; -webkit-user-select: none; user-select: none; }
.zu-marquee-js.is-dragging, .zu-marquee-js.is-dragging * { cursor: grabbing !important; }
.zu-marquee-js img, .zu-marquee-js a { -webkit-user-drag: none; }

/* Contacto (02/10/2026): el formulario propio de la página (id contacto) sustituye al CTA + formulario del footer,
 * que llevan la clase zu-footer-cta. Id de la página Contacto: 631. */
body.page-id-631 .zu-footer-cta { display: none !important; }

/* Contenido del artículo y textos legales: aire entre elementos que Divi deja pegados (02/10/2026). */
.zu-prose .et_pb_post_content > *:first-child { margin-top: 0; }

/* Botones con el icono de WhatsApp (02/10/2026): añadir la clase zu-wa al botón (Avanzado > Clase CSS). */
body #page-container .et_pb_section .zu-wa.et_pb_button.et_pb_module, body #page-container .et_pb_section .zu-wa .et_pb_button.et_pb_button { display: inline-flex !important; flex-direction: row !important; align-items: center; gap: 10px; }
body #page-container .et_pb_section .zu-wa.et_pb_button.et_pb_module::before, body #page-container .et_pb_section .zu-wa .et_pb_button.et_pb_button::before { content: "" !important; position: static !important; display: inline-block !important; flex: 0 0 auto; width: 18px; height: 18px; margin: 0 !important; opacity: 1 !important; font-size: 0 !important; background-color: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 0 1-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0 0 12.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 0 0-3.48-8.413z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 0 1-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0 0 12.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 0 0-3.48-8.413z'/%3E%3C/svg%3E") center / contain no-repeat; transform: none !important; }
body #page-container .et_pb_section .zu-wa.et_pb_button.et_pb_module::after, body #page-container .et_pb_section .zu-wa .et_pb_button.et_pb_button::after { display: none !important; }

/* Carrusel de imágenes (02/10/2026): un grupo con la clase zu-carousel es la pista (scroll-snap, una imagen por vista).
 * js/zu-extras.js añade las flechas y el contador debajo; sin JS sigue siendo deslizable. */
.zu-carousel { overflow-x: auto !important; overflow-y: hidden !important; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.zu-carousel::-webkit-scrollbar { display: none; }
.zu-carousel > * { scroll-snap-align: start; flex: 0 0 100% !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; }
.zu-car-nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 16px; }
.zu-car-count { font: 400 16px/1 Inter, sans-serif; color: #6b635b; letter-spacing: .04em; }
.zu-car-btn { width: 44px; height: 44px; padding: 0; border-radius: 50%; border: 1px solid #cfc4b4; background: transparent; color: #231f1c; font: 400 18px/1 Inter, sans-serif; cursor: pointer; transition: background-color .24s ease, color .24s ease, border-color .24s ease; }
.zu-car-btn:hover:not(:disabled) { background: #231f1c; border-color: #231f1c; color: #fbf9f5; }
.zu-car-btn:disabled { opacity: .35; cursor: default; }
.zu-car-btn:focus-visible { outline: 2px solid #a8834f; outline-offset: 3px; }

/* Blog y categorías (02/10/2026): el botón «Entradas anteriores / siguientes» no queda pegado a las tarjetas ni al borde de la sección. */
.et_pb_posts .pagination, .et_pb_blog_grid .pagination { padding: 48px 0 44px !important; }
/* Formularios (05/10/2026): la casilla de "Protección de datos" y los botones de opción no se veían
 * (Divi los pinta #eee sin borde sobre el fondo arena) y el check salía en el azul de Divi. */
.et_pb_contact_field_checkbox input + label i,
.et_pb_contact_field_radio input + label i { background-color: #fffdf9 !important; border: 1px solid #8f8375 !important; box-sizing: border-box; border-radius: 5px; vertical-align: middle; transition: background-color .2s ease, border-color .2s ease; }
.et_pb_contact_field_radio input + label i { border-radius: 50%; }
.et_pb_contact_field_checkbox label:hover i, .et_pb_contact_field_radio label:hover i { border-color: #231f1c !important; }
.et_pb_contact_field_checkbox input:checked + label i { background-color: #231f1c !important; border-color: #231f1c !important; }
.et_pb_contact_field_checkbox input:checked + label i::before { color: #fbf9f5 !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%); line-height: 1 !important; }
.et_pb_contact_field_radio input:checked + label i { border-color: #231f1c !important; }
.et_pb_contact_field_radio input:checked + label i::before { background-color: #231f1c !important; }
/* Botones circulares con flecha (filas de Tratamientos y carrusel), 05/10/2026: el hover era negro y la flecha
 * no se veía. Ahora claro, como el resto de botones: fondo arena, borde y flecha oscuros. */
body #page-container .et_pb_group:hover > .zu-arr.zu-arr { background-color: #f3ede4 !important; border-color: #231f1c !important; }
body #page-container .et_pb_group:hover > .zu-arr.zu-arr p { color: #231f1c !important; }
.zu-car-btn:hover:not(:disabled) { background: #f3ede4 !important; border-color: #231f1c !important; color: #231f1c !important; }
/* Índice de los artículos (05/10/2026): sin el aviso "No headings found" mientras el script de Divi está diferido;
 * js/zu-extras.js monta el índice al cargar. Los H2 dejan sitio al header fijo al saltar desde el índice. */
.et_pb_table_of_contents__empty { display: none !important; }
.et_pb_post_content h2 { scroll-margin-top: 110px; }

/* Tamaño mínimo de letra 16 px en toda la web (06/10/2026) */
.et_pb_before_after_image_label { font-size: 16px !important; }
/* Cabecera entre 981 y 1240 px: menú hamburguesa a la derecha, tras el botón Pedir cita */
@media (min-width: 981px) and (max-width: 1240px) {
  .et-l--header .et_pb_column_1_tb_header { order: 3; flex: 0 0 auto !important; width: auto !important; margin-left: 20px; }
  .et-l--header .et_pb_column_2_tb_header { margin-left: auto; }
  .et-l--header .et_pb_column_1_tb_header { position: static !important; }
  .et-l--header .et_mobile_menu, .et-l--header .et_mobile_menu ul, .et-l--header .et_mobile_menu li { list-style: none !important; }
  .et-l--header .et_mobile_menu { top: calc(100% + 4px) !important; }
  .et-l--header .et_mobile_menu ul { margin: 0 !important; padding-bottom: 0 !important; }
}

/* Formularios: textos a 16 px también con el CSS usado de WP Rocket (07/10/2026) */
#page-container .et_pb_contact_form_container .et_pb_contact_form_label,
#page-container .et_pb_contact_form_container .et_pb_contact_field_options_title,
#page-container .et_pb_contact_form_container .et_contact_bottom_container label,
#page-container .et_pb_contact_form_container .et_pb_contact_captcha_question { font-size: 16px !important; }

/* ===== Revisión 07/10/2026 ===== */
/* Fuente base: Divi deja "Open Sans" en body (no se carga) y los artículos, textos legales y textos sin fuente propia salían en Arial */
html body, html body input, html body textarea, html body select, html body button { font-family: 'Inter', Helvetica, Arial, sans-serif; }

/* Enlaces sin color propio: dorado de la web en vez del azul por defecto de Divi (#2ea3f2) */
body a { color: #7a5c33; }

/* Rejilla de entradas (blog, categorías y "Sigue leyendo"): 2 columnas en tablet y 1 en móvil */
@media (min-width: 768px) and (max-width: 980px) { #page-container .et_pb_blog_posts.et_grid_module { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 767px) { #page-container .et_pb_blog_posts.et_grid_module { grid-template-columns: minmax(0, 1fr) !important; } }

/* Instalaciones, móvil: 2 fotos por fila en las galerías */
@media (max-width: 767px) { body.page-id-1115 .et_pb_group:has(> .et_pb_image + .et_pb_image) > .et_pb_image { width: calc(50% - 10px) !important; max-width: none !important; } }

/* Captcha de los formularios: la suma y la casilla siempre en la misma línea */
#page-container .et_pb_contact_form_container .et_pb_contact_right label { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
#page-container .et_pb_contact_form_container .et_pb_contact_right p { white-space: nowrap; }

/* Páginas sin el CTA del pie (Cita previa y Gracias): sin el hueco doble antes de las columnas del pie */
body.page-id-1118 .zu-footer-cta { display: none !important; }
body.page-id-631 .et-l--footer .et_pb_section_0_tb_footer, body.page-id-1118 .et-l--footer .et_pb_section_0_tb_footer { padding-top: 0 !important; }
body.page-id-631 .et-l--footer .et_pb_row_2_tb_footer, body.page-id-1118 .et-l--footer .et_pb_row_2_tb_footer { margin-top: 0 !important; }

/* H1 con raya: en tablet/móvil, si el título ocupa dos líneas la raya queda como trazo corto y no como subrayado */
@media (max-width: 980px) { #page-container h1 .zu-rule { flex: 0 0 56px !important; margin-top: 0.22em; } }

/* Política de cookies: la tabla se desplaza en horizontal dentro de su caja en vez de cortarse */
body.page-id-642 .wp-block-table { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
body.page-id-642 .wp-block-table table { table-layout: auto !important; width: 100%; min-width: 1180px; border-collapse: collapse; }
body.page-id-642 .wp-block-table th, body.page-id-642 .wp-block-table td { padding: 10px 14px; vertical-align: top; min-width: 120px; word-break: normal; overflow-wrap: normal; hyphens: none; }
body.page-id-642 .wp-block-table td:nth-child(4), body.page-id-642 .wp-block-table th:nth-child(4) { min-width: 260px; }
body.page-id-642 .wp-block-table td a { overflow-wrap: anywhere; }

/* zu-heading-links 07/10/2026: nombres y títulos de tarjeta enlazados (equipo, tratamientos) con el color del título; dorado al pasar el ratón */
#page-container .et_pb_module_header a { color: inherit; text-decoration: none; transition: color .2s ease; }
#page-container .et_pb_module_header a:hover, #page-container .et_pb_module_header a:focus-visible { color: #7a5c33; }
