/*
 * «Contraetiqueta»: estilo del panel del staff (Filament 3).
 * Cada estado se lee en un sello numerado, como la contraetiqueta de una
 * botella con denominación de origen, y las tablas siguen las reglas de la
 * tabla nutricional del envase. Solo usa las variables de marca.css.
 */

/* ---------- Base ---------- */
html, body, .fi-body { font-family: var(--marca-fuente) !important; }
body, .fi-body, .fi-main-ctn { background-color: var(--marca-fondo) !important; color: var(--marca-texto); }
::selection { background: var(--marca-acento); color: var(--marca-texto); }
* { scrollbar-color: var(--marca-lila) transparent; scrollbar-width: thin; }
:focus-visible { outline: 2px solid var(--marca-acento) !important; outline-offset: 2px; }
.fi-ta-text, .fi-ta-cell, .fi-wi-stats-overview-stat-value { font-variant-numeric: tabular-nums; }
/* La columna principal puede encoger y el menú no: sin esto, un texto largo sin
   saltos (las migas de pan) estrechaba el menú y el contenido quedaba debajo. */
.fi-main-ctn { min-width: 0; }
@media (min-width: 1024px) { .fi-main-sidebar { flex-shrink: 0; } }

/* ---------- Menú lateral (shell índigo, compacto: cabe entero en 900 px) ---------- */
.fi-sidebar, .fi-sidebar-nav { background-color: var(--marca-shell) !important; }
.fi-sidebar-header {
    background-color: var(--marca-shell) !important;
    border-bottom: 1px solid rgba(140, 154, 200, .22) !important;
    box-shadow: none !important;
    height: 4rem !important;
}
.fi-sidebar-nav { padding: .75rem .75rem 1.5rem !important; row-gap: .6rem !important; }
.fi-sidebar-nav-groups { row-gap: .7rem !important; }
.fi-sidebar-group-button { padding: 0 .5rem .25rem !important; }
.fi-sidebar-group-label {
    color: var(--marca-shell-tenue) !important;
    font-size: .68rem !important;
    font-weight: 700 !important;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.fi-sidebar-group-collapse-button { color: var(--marca-shell-tenue) !important; }
.fi-sidebar-group-items { row-gap: 1px !important; }
.fi-sidebar-item-button {
    padding: .28rem .6rem !important;
    min-height: 1.75rem;
    border-radius: 3px !important;
    gap: .65rem !important;
    transition: background-color .15s ease-out;
}
.fi-sidebar-item-button:hover, .fi-sidebar-item-button:focus-visible { background-color: var(--marca-shell-2) !important; }
.fi-sidebar-item-label { color: var(--marca-shell-texto) !important; font-size: .875rem !important; font-weight: 400 !important; }
.fi-sidebar-item-icon { color: var(--marca-shell-tenue) !important; width: 1.15rem !important; height: 1.15rem !important; }
.fi-sidebar-item-button:hover .fi-sidebar-item-label { color: #fff !important; }
/* Activo: papel claro con la pestaña ámbar a la izquierda (lo único ámbar del menú) */
.fi-sidebar-item-active .fi-sidebar-item-button {
    background-color: rgba(255, 255, 255, .12) !important;
}
.fi-sidebar-item-active .fi-sidebar-item-label { color: #fff !important; font-weight: 700 !important; }
.fi-sidebar-item-active .fi-sidebar-item-icon { color: var(--marca-acento) !important; }
.fi-sidebar-item-grouped-border > * { background-color: rgba(140, 154, 200, .35) !important; }
/* Extensión de cada sección: el contador del menú, en cifras tabulares */
.fi-sidebar-item .fi-badge {
    background: transparent !important;
    color: var(--marca-shell-texto) !important;
    box-shadow: inset 0 0 0 1px rgba(140, 154, 200, .45) !important;
    font-family: var(--marca-fuente-codigo);
    font-size: .68rem !important;
}
.fi-sidebar .fi-icon-btn { color: var(--marca-shell-tenue) !important; }

/* ---------- Barra superior: papel con filete ---------- */
.fi-topbar > nav {
    background-color: var(--marca-papel) !important;
    border-bottom: 1px solid var(--marca-filete) !important;
    box-shadow: none !important;
    height: 4rem !important;
}
.fi-topbar .fi-icon-btn { color: var(--marca-texto-2) !important; }
.fi-global-search-field .fi-input-wrp { background: var(--marca-fondo) !important; box-shadow: inset 0 0 0 1px var(--marca-filete) !important; }

/* ---------- Cabecera de página ---------- */
.fi-main { padding-top: .5rem; }
.fi-header { gap: 1rem 2rem !important; align-items: flex-end !important; }
/* En el móvil la cabecera va en columna: el título a la izquierda, no empujado a la derecha. */
@media (max-width: 639px) { .fi-header { align-items: flex-start !important; } }
.fi-header-heading {
    color: var(--marca-texto) !important;
    font-size: 1.6rem !important;
    line-height: 1.15 !important;
    font-weight: 900 !important;
    letter-spacing: -.015em !important;
    text-wrap: balance;
    max-width: 48rem;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.fi-header-subheading { color: var(--marca-texto-2) !important; }
.fi-breadcrumbs { margin-bottom: .35rem; }
.fi-breadcrumbs-item-label { color: var(--marca-texto-3) !important; font-size: .78rem !important; font-weight: 400 !important; }
.fi-breadcrumbs-item-label:hover { color: var(--marca-tinta) !important; }
.fi-breadcrumbs-item-separator { color: var(--marca-lila) !important; }
/* Una sola línea de migas: los títulos largos de evento se recortan */
.fi-breadcrumbs-list { flex-wrap: nowrap !important; }
.fi-breadcrumbs-item { min-width: 0; }
.fi-breadcrumbs-item:first-child, .fi-breadcrumbs-item:last-child { flex-shrink: 0; }
.fi-breadcrumbs-item-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 32rem; display: block; }
.fi-breadcrumbs-item:first-child .fi-breadcrumbs-item-label, .fi-breadcrumbs-item:last-child .fi-breadcrumbs-item-label { max-width: none; overflow: visible; }

/* Acciones de cabecera: pasan a otra línea en vez de salirse de la pantalla */
.fi-header > div:last-child, .fi-header .fi-ac { flex-wrap: wrap !important; justify-content: flex-end; row-gap: .5rem; }
.fi-header > div:first-child { min-width: 0; }
/* Los 22rem son el ancho mínimo del título en fila; en columna (móvil) serían alto y dejaban un hueco enorme. */
@media (min-width: 640px) { .fi-header > div:first-child { flex: 1 1 22rem; } }
@media (max-width: 639px) { .fi-header > div:last-child, .fi-header .fi-ac { justify-content: flex-start; } }

/* Una sola acción de tinta por cabecera: las demás, blancas con filete */
.fi-header .fi-btn.fi-btn-color-success, .fi-header .fi-btn.fi-btn-color-info {
    background-color: var(--marca-papel) !important; color: var(--marca-texto) !important; box-shadow: inset 0 0 0 1px var(--marca-filete) !important;
}
.fi-header .fi-btn.fi-btn-color-success .fi-btn-icon, .fi-header .fi-btn.fi-btn-color-info .fi-btn-icon { color: var(--marca-tinta) !important; }
.fi-ta-cell { padding-inline: .6rem !important; }

/* ---------- Botones ---------- */
.fi-btn { border-radius: 3px !important; font-weight: 700 !important; letter-spacing: .01em; box-shadow: none !important; }
.fi-btn.fi-btn-color-primary, .fi-btn-color-primary:not(.fi-btn-outlined) { background-color: var(--marca-tinta) !important; color: #fff !important; }
.fi-btn.fi-btn-color-primary:hover { background-color: var(--marca-tinta-hover) !important; }
.fi-btn.fi-btn-color-gray, .fi-btn-outlined {
    background-color: var(--marca-papel) !important;
    color: var(--marca-texto) !important;
    box-shadow: inset 0 0 0 1px var(--marca-filete) !important;
}
.fi-btn.fi-btn-color-gray:hover { box-shadow: inset 0 0 0 1px var(--marca-lila) !important; background-color: var(--marca-lila-claro) !important; }
.fi-btn .fi-btn-icon { opacity: .85; }
/* Botones de color de estado (verde, rojo) conservan su color pero con el mismo canto */
.fi-btn.fi-btn-color-success { background-color: #1d7a4f !important; color: #fff !important; }
.fi-btn.fi-btn-color-danger { background-color: #b42318 !important; color: #fff !important; }
.fi-btn.fi-btn-color-warning { background-color: var(--marca-acento) !important; color: var(--marca-acento-texto) !important; }
.fi-btn.fi-btn-color-info { background-color: var(--marca-lila) !important; color: var(--marca-shell) !important; }
.fi-link { color: var(--marca-tinta) !important; }

/* ---------- Hojas (secciones y tablas): papel blanco con barra de tinta ---------- */
.fi-section, .fi-ta-ctn, .fi-wi-widget > .fi-section, .fi-fo-tabs, .fi-in-tabs {
    background-color: var(--marca-papel) !important;
    border-radius: 4px !important;
    box-shadow: 0 1px 2px rgba(12, 26, 91, .05), 0 0 0 1px var(--marca-filete) !important;
    border: 0 !important;
}
.fi-section-header { background: transparent !important; border-bottom: 1px solid var(--marca-filete-suave) !important; padding-block: .9rem !important; }
.fi-section-header-heading { color: var(--marca-texto) !important; font-size: .95rem !important; font-weight: 900 !important; letter-spacing: -.005em; }
.fi-section-header-description { color: var(--marca-texto-3) !important; }
.fi-section-header-icon { color: var(--marca-tinta) !important; }

/* ---------- Pestañas de la ficha del evento ---------- */
.fi-tabs { overflow-x: auto !important; scrollbar-width: thin; }
.fi-tabs { background: var(--marca-papel) !important; border-radius: 4px !important; box-shadow: 0 0 0 1px var(--marca-filete) !important; padding: .25rem !important; gap: .15rem !important; }
.fi-tabs-item { border-radius: 3px !important; padding-block: .45rem !important; }
.fi-tabs-item-label { color: var(--marca-texto-2) !important; font-weight: 700 !important; font-size: .85rem !important; }
.fi-tabs-item-icon { color: var(--marca-texto-3) !important; }
.fi-tabs-item:hover { background: var(--marca-fondo) !important; }
.fi-tabs-item-active { background: var(--marca-shell) !important; }
.fi-tabs-item-active .fi-tabs-item-label, .fi-tabs-item-active .fi-tabs-item-icon { color: #fff !important; }
.fi-tabs-item-active .fi-badge { box-shadow: inset 0 0 0 1px rgba(255,255,255,.5) !important; color: #fff !important; background: transparent !important; }

/* ---------- Tabla nutricional ---------- */
.fi-ta-ctn { box-shadow: 0 1px 2px rgba(12, 26, 91, .05), 0 0 0 1px var(--marca-filete), inset 0 6px 0 var(--marca-shell) !important; padding-top: 6px; }
.fi-ta-header-toolbar { padding-block: .65rem !important; border-bottom: 0 !important; }
.fi-ta-table > thead { background: var(--marca-papel) !important; }
.fi-ta-table > thead > tr { box-shadow: inset 0 -2px 0 var(--marca-texto); }
.fi-ta-header-cell { padding-block: .6rem !important; background: transparent !important; }
.fi-ta-header-cell-label, .fi-ta-header-cell button span {
    color: var(--marca-texto) !important;
    font-size: .7rem !important;
    font-weight: 900 !important;
    letter-spacing: .09em;
    text-transform: uppercase;
}
.fi-ta-header-cell-sort-icon { color: var(--marca-texto-3) !important; }
.fi-ta-table > tbody { border-top: 0 !important; }
.fi-ta-table > tbody > tr { border-top: 1px solid var(--marca-filete-suave) !important; }
.fi-ta-row { transition: background-color .12s ease-out; }
.fi-ta-row:hover { background-color: #f6f8fd !important; }
.fi-ta-row.fi-selected, .fi-ta-row:has(.fi-ta-record-checkbox:checked) { background-color: var(--marca-acento-claro) !important; }
.fi-ta-cell { padding-block: .2rem !important; }
.fi-ta-text { padding-block: .55rem !important; }
.fi-ta-text-item-label { color: var(--marca-texto) !important; font-size: .875rem !important; line-height: 1.35 !important; }
/* Nombres largos: dos líneas como máximo en vez de cuatro */
.fi-ta-text-item-label { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fi-ta-cell:first-of-type .fi-ta-text-item-label, .fi-ta-cell .fi-ta-text-item-label.font-bold { font-weight: 700; }
.fi-ta-summary-row { box-shadow: inset 0 2px 0 var(--marca-texto); }
.fi-ta-checkbox, .fi-checkbox-input { border-radius: 2px !important; color: var(--marca-tinta) !important; }
.fi-pagination-overview { color: var(--marca-texto-3) !important; font-variant-numeric: tabular-nums; }
.fi-pagination-item-button { border-radius: 3px !important; }
.fi-pagination-item.fi-active .fi-pagination-item-label, .fi-pagination-item-active .fi-pagination-item-label { color: var(--marca-tinta) !important; font-weight: 900; }
.fi-ta-empty-state-heading { color: var(--marca-texto) !important; font-weight: 900 !important; }
.fi-ta-empty-state-icon-ctn { background: var(--marca-lila-claro) !important; border-radius: 4px !important; }
.fi-ta-empty-state-icon { color: var(--marca-tinta) !important; }

/* ---------- Contraetiqueta: el sello de estado ---------- */
:is(.fi-ta-cell, .fi-in-entry-wrp, .fi-in-text, .fi-fo-field-wrp) .fi-badge {
    border-radius: 2px !important;
    background-color: var(--marca-papel) !important;
    color: rgb(var(--c-700, 55 65 81)) !important;
    box-shadow:
        inset 0 0 0 1px rgb(var(--c-600, 75 85 99)),
        inset 0 0 0 2.5px var(--marca-papel),
        inset 0 0 0 3.5px rgba(var(--c-600, 75 85 99), .35) !important;
    --tw-ring-shadow: 0 0 #0000 !important;
    font-size: .66rem !important;
    font-weight: 900 !important;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: .32rem .6rem !important;
    line-height: 1 !important;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
:is(.fi-ta-cell, .fi-in-entry-wrp, .fi-in-text, .fi-fo-field-wrp) .fi-badge .fi-badge-icon { color: rgb(var(--c-600, 75 85 99)) !important; }
/* Sello ámbar: lo que pide una acción ahora */
:is(.fi-ta-cell, .fi-in-entry-wrp, .fi-in-text, .fi-fo-field-wrp) .fi-badge.fi-color-warning {
    background-color: var(--marca-acento-claro) !important;
    color: var(--marca-acento-texto) !important;
    box-shadow:
        inset 0 0 0 1px #c98a00,
        inset 0 0 0 2.5px var(--marca-acento-claro),
        inset 0 0 0 3.5px rgba(201, 138, 0, .4) !important;
}

/* Contadores (filtros, pestañas, campana): cifra pequeña, sin sello */
.fi-icon-btn .fi-badge, .fi-tabs-item .fi-badge, .fi-ac .fi-badge {
    border-radius: 2px !important; font-family: var(--marca-fuente-codigo); font-size: .65rem !important;
    padding: .1rem .3rem !important; min-width: 0 !important;
}

/* ---------- Agenda de citas: jornadas y rejilla de franjas ---------- */
.sch-label { color: var(--marca-texto) !important; font-weight: 900 !important; letter-spacing: .12em; font-size: .68rem !important; }
.sch-days .sch-day {
    border-radius: 3px !important; border: 0 !important; background: var(--marca-papel) !important; color: var(--marca-texto) !important;
    box-shadow: inset 0 0 0 1px var(--marca-filete); font-family: var(--marca-fuente-codigo); font-weight: 700 !important; padding: .5rem .9rem !important;
}
.sch-days .sch-day.is-active { background: var(--marca-shell) !important; color: #fff !important; box-shadow: inset 0 -3px 0 var(--marca-acento); }
.sch-slots { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); gap: 0 !important; background: var(--marca-papel); box-shadow: 0 0 0 1px var(--marca-filete); border-radius: 4px; overflow: hidden; }
.sch-slots .sch-slot {
    border: 0 !important; border-radius: 0 !important; background: var(--marca-papel) !important; text-align: left; padding: .7rem .85rem !important;
    box-shadow: inset -1px -1px 0 var(--marca-filete-suave); display: flex; flex-direction: column; gap: .1rem; color: var(--marca-texto) !important;
}
.sch-slots .sch-slot:hover { background: var(--marca-lila-claro) !important; }
.sch-slot-hora { font-family: var(--marca-fuente-codigo); font-weight: 700; font-size: .92rem; letter-spacing: -.01em; }
.sch-slot-tipo { font-size: .7rem; text-transform: uppercase; letter-spacing: .09em; color: var(--marca-texto-3); font-weight: 700; }
.sch-slots .sch-slot.is-active { background: var(--marca-acento-claro) !important; box-shadow: inset 0 0 0 2px var(--marca-acento), inset -1px -1px 0 var(--marca-filete-suave); }
/* Franja llena: trama cruzada, se lee sin depender del color */
.sch-slots .sch-slot.is-full { background-image: repeating-linear-gradient(45deg, rgba(180, 35, 24, .09) 0 2px, transparent 2px 7px), repeating-linear-gradient(-45deg, rgba(180, 35, 24, .09) 0 2px, transparent 2px 7px) !important; }
.sch-warn { border: 0 !important; border-radius: 3px !important; background: var(--marca-lila-claro) !important; box-shadow: inset 0 0 0 1px var(--marca-lila); color: var(--marca-texto) !important; }
.sch-bar { background: var(--marca-papel) !important; border: 0 !important; border-radius: 4px !important; box-shadow: 0 0 0 1px var(--marca-filete), inset 0 4px 0 var(--marca-shell); }

/* ---------- Formularios ---------- */
.fi-input-wrp {
    border-radius: 3px !important;
    background-color: var(--marca-papel) !important;
    box-shadow: inset 0 0 0 1px var(--marca-filete) !important;
    --tw-ring-shadow: 0 0 #0000 !important;
}
.fi-input-wrp:focus-within { box-shadow: inset 0 0 0 1px var(--marca-tinta), 0 0 0 3px rgba(15, 33, 139, .12) !important; }
.fi-input, .fi-select-input { color: var(--marca-texto) !important; }
.fi-input::placeholder { color: var(--marca-texto-3) !important; }
.fi-fo-field-wrp-label span { color: var(--marca-texto) !important; font-weight: 700 !important; font-size: .82rem !important; }
.fi-fo-field-wrp-helper-text { color: var(--marca-texto-3) !important; }
.fi-fo-toggle.bg-primary-600, button[role=switch].bg-primary-600 { background-color: var(--marca-tinta) !important; }

/* ---------- Cifras del escritorio: una sola hoja con columnas regladas ---------- */
.fi-wi-stats-overview-stats-ctn {
    gap: 0 !important; background: var(--marca-papel); border-radius: 4px;
    box-shadow: 0 1px 2px rgba(12, 26, 91, .05), 0 0 0 1px var(--marca-filete), inset 0 6px 0 var(--marca-shell);
    padding-top: 6px; overflow: hidden;
}
.fi-wi-stats-overview-stat {
    border-radius: 0 !important; background: transparent !important; box-shadow: inset -1px 0 0 var(--marca-filete-suave) !important;
    padding: 1.1rem 1.4rem 1.2rem !important;
}
.fi-wi-stats-overview-stat-icon { display: none !important; }
.fi-wi-stats-overview-stat-label { color: var(--marca-texto) !important; font-size: .7rem !important; font-weight: 900 !important; letter-spacing: .1em; text-transform: uppercase; }
.fi-wi-stats-overview-stat-value { color: var(--marca-texto) !important; font-family: var(--marca-fuente-codigo); font-weight: 700 !important; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.fi-wi-stats-overview-stat-description, .fi-wi-stats-overview-stat-description * { font-size: .8rem !important; color: var(--marca-texto-3) !important; }

/* ---------- Menús desplegables, avisos y modales ---------- */
.fi-dropdown-panel, .fi-modal-window { border-radius: 4px !important; box-shadow: 0 12px 32px -8px rgba(12, 26, 91, .28), 0 0 0 1px var(--marca-filete) !important; }
.fi-modal-heading { color: var(--marca-texto) !important; font-weight: 900 !important; }
.fi-dropdown-list-item-label { color: var(--marca-texto) !important; }
.fi-avatar { border-radius: 3px !important; }

/* ---------- Pantalla de acceso del staff: la hoja como etiqueta reglada ---------- */
.fi-simple-layout { background-color: var(--marca-shell) !important; background-image: none !important; }
.fi-simple-main {
    border-radius: 4px !important;
    box-shadow: 0 24px 60px -12px rgba(0, 0, 0, .45), inset 0 6px 0 var(--marca-tinta) !important;
    padding-top: 2.75rem !important;
}
.fi-simple-header-heading { color: var(--marca-texto) !important; font-weight: 900 !important; letter-spacing: -.015em; }

/* Utilidades que usan las vistas propias y que el CSS precompilado de
   Filament no trae (sin ellas se ignoraban en silencio). */
.uppercase { text-transform: uppercase; }
.py-1\.5 { padding-top: .375rem; padding-bottom: .375rem; }
.space-y-0\.5 > * + * { margin-top: .125rem; }
.hover\:underline:hover { text-decoration: underline; }
.text-gray-900 { color: #111827; }
.mb-1 { margin-bottom: .25rem; }
.mb-3 { margin-bottom: .75rem; }
.mt-4 { margin-top: 1rem; }
.pr-1 { padding-right: .25rem; }
.pr-4 { padding-right: 1rem; }

/* Pestañas del evento: el borde derecho se desvanece para que se vea que hay más */
.fi-tabs { -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 48px), transparent); padding-right: 48px !important; }

/* Contador del botón de filtros: no se muestra (con filtros activos ya salen
   sus etiquetas debajo de la cabecera de la tabla). */
.fi-ta-header-toolbar .fi-icon-btn .fi-badge, .fi-ta-header-toolbar .fi-icon-btn-badge-ctn { display: none !important; }