/* Estilos personalizados de DomiCRM */
[x-cloak] { display: none !important; }

body { font-family: 'Inter', system-ui, -apple-system, sans-serif; }

table { border-collapse: collapse; }

.htmx-indicator { display: none; }
.htmx-request .htmx-indicator { display: inline-block; }
.htmx-request.htmx-indicator { display: inline-block; }

.kanban-column { min-height: 60vh; }

.badge {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
}

/* ---------------------------------------------------------------------------
 * Paleta `rose` — shim para Tailwind 2.2.19 (CDN)
 *
 * El CDN de Tailwind 2.2 NO incluye la paleta ``rose`` (solo ``red``). Pero
 * las plantillas usan extensivamente ``bg-rose-*`` / ``text-rose-*`` / etc.
 * para acciones destructivas (botón "Eliminar", alertas de peligro). Sin
 * estas reglas el fondo queda transparente y el texto blanco desaparece
 * contra los modales blancos.
 *
 * Los valores son los estándar de Tailwind v3 (rose palette).
 * --------------------------------------------------------------------------- */
.text-rose-500 { color: #f43f5e; }
.text-rose-600 { color: #e11d48; }
.text-rose-700 { color: #be123c; }
.text-rose-800 { color: #9f1239; }

.bg-rose-50  { background-color: #fff1f2; }
.bg-rose-100 { background-color: #ffe4e6; }
.bg-rose-500 { background-color: #f43f5e; }
.bg-rose-600 { background-color: #e11d48; }

.border-rose-200 { border-color: #fecdd3; }
.border-rose-300 { border-color: #fda4af; }

.hover\:bg-rose-50:hover  { background-color: #fff1f2; }
.hover\:bg-rose-700:hover { background-color: #be123c; }

.hover\:text-rose-700:hover { color: #be123c; }
.hover\:text-rose-800:hover { color: #9f1239; }

.focus\:ring-rose-400:focus {
    --tw-ring-color: rgba(251, 113, 133, 0.5);
    box-shadow: 0 0 0 3px rgba(251, 113, 133, 0.5);
}

/* ---------------------------------------------------------------------------
 * Arbitrary z-index values — shim para Tailwind 2.2.19 (CDN)
 *
 * La notación ``z-[900]`` requiere el motor JIT de Tailwind v3. En v2 la
 * clase no se genera y el elemento queda con ``z-index: auto``, que en
 * muchos navegadores equivale a 0. Resultado: los modales (``z-[900]``,
 * ``z-[950]``, etc.) quedaban DEBAJO de elementos con z-index válido como
 * el ``thead`` sticky (``z-20``), y se veían tiras de tabla cruzando el
 * modal.
 *
 * Estas reglas replican exactamente lo que el motor JIT generaría para
 * cada valor arbitrario actualmente en uso en los templates.
 * --------------------------------------------------------------------------- */
.z-\[5\]    { z-index: 5; }
.z-\[60\]   { z-index: 60; }
.z-\[900\]  { z-index: 900; }
.z-\[950\]  { z-index: 950; }
.z-\[960\]  { z-index: 960; }
.z-\[1000\] { z-index: 1000; }
.z-\[1100\] { z-index: 1100; }