/* ══════════════════════════════════════════════════════════════════════ * capas.css — quién va encima de quién * * EL PROBLEMA * SweetAlert2 monta su contenedor con `z-index: 1000000` en esta plantilla. * Todo lo que flota — un calendario, un desplegable, un reloj, un aviso — se * dibuja en ``, hermano de ese contenedor. Si su z-index es menor, * queda DEBAJO del modal: se abre, ocupa su sitio, pero no se ve y los clics * se los lleva el modal. * * Así se veía desde fuera, y son cuatro síntomas del mismo fallo: * · "el modal abre como que atrás" → el diálogo estaba en 20 500 * · "las horas no funcionan" → el reloj, en 20 000 * · "la fecha no muestra el calendario" → flatpickr, en 10 060 * · desplegables que no despliegan → SlimSelect, en 10 000 * * LA REGLA * Nada de números sueltos repartidos por los ficheros. El orden vive aquí, en * un sitio, y por encima del modal. Si mañana alguien añade otra capa * flotante, la añade a esta lista y no vuelve a pasar. * * 999 900 modales de Materialize — el formulario que abre los diálogos * 1 000 000 SweetAlert2 (lo pone la librería, no se toca) * 1 000 200 calendarios y desplegables — nacen dentro de un formulario * 1 000 300 reloj — se abre desde un campo del formulario * 1 000 400 diálogos propios — van sobre el formulario que los llamó * 1 000 500 avisos — se leen aunque haya un diálogo encima * 1 000 600 cámara — mientras se apunta, no puede haber nada delante * ══════════════════════════════════════════════════════════════════════ */ :root { /* El modal de Materialize va DEBAJO de SweetAlert. Llevaba 99 999 999 en custom.css, por encima de todo este sistema, y por eso un diálogo abierto desde dentro de un modal quedaba detrás de él. El 2026-09-04 se «arregló» subiendo SweetAlert a mil millones —lo que esta misma cabecera dice que no se toca— y eso dejó el reloj y el calendario debajo del formulario de esterilización: la odontóloga no podía escribir las horas de la carga. La regla no cambia: quien abre va debajo de lo que abre. */ --capa-modal: 999900; --capa-flotante: 1000200; --capa-reloj: 1000300; --capa-dialogo: 1000400; --capa-aviso: 1000500; --capa-camara: 1000600; } /* Calendarios. Un selector de fecha siempre va sobre lo que lo abrió: no hay caso en el que deba quedar debajo. */ /* La clase repetida no es un descuido: sube la especificidad a (0,2,0) para ganarle a un `.flatpickr-calendar { z-index: 10060 !important }` que la plantilla inyecta en un