/* Tema DLT, sobrio (referencia de Bas, 27-sep: su otra app). Colores de siempre (piedra neutra; cuero solo en el
   botón primario y el foco). Barra lateral sobre el fondo gris y el contenido en una tarjeta con borde fino.
   Sin barras de acento: la estructura la dan los bordes de 1 px y el espacio. */
:root { --dlt-fondo: var(--gray-100); --dlt-tarjeta: #fff; --dlt-linea: var(--gray-200); --dlt-activo: var(--gray-200); }
.dark { --dlt-fondo: var(--gray-950); --dlt-tarjeta: var(--gray-900); --dlt-linea: rgb(255 255 255 / .1); --dlt-activo: rgb(255 255 255 / .08); }

.fi-body { letter-spacing: -0.005em; background-color: var(--dlt-fondo); }

/* Barra lateral: mismo fondo que la página, sin bordes propios. */
.fi-main-sidebar, .fi-sidebar-header, .fi-sidebar-header-ctn, .fi-sidebar-footer { background-color: var(--dlt-fondo); box-shadow: none; border: 0; }
.fi-sidebar-header { box-shadow: none; }
.fi-main-sidebar .fi-logo { font-size: 1.125rem; font-weight: 700; }
.fi-sidebar-item-btn { border-radius: .625rem; }
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn { background-color: var(--dlt-activo); }
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-label { font-weight: 600; color: var(--gray-950); }
.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-label { color: #fff; }
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-icon { color: var(--gray-700); }
.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-icon { color: var(--gray-200); }
.fi-sidebar-footer { border-top: 1px solid var(--dlt-linea); padding: .625rem .75rem; }
.fi-layout-sidebar-toggle-btn-ctn { background-color: var(--dlt-fondo); }

/* Contenido en una tarjeta con borde fino y esquinas redondeadas, separada del borde de la ventana. */
@media (min-width: 64rem) {
    .fi-main-ctn {
        margin: .5rem .5rem .5rem 0; min-height: calc(100dvh - 1rem);
        background-color: var(--dlt-tarjeta); border: 1px solid var(--dlt-linea); border-radius: 1.25rem;
    }
    [dir='rtl'] .fi-main-ctn { margin: .5rem 0 .5rem .5rem; }
}
@media (max-width: 63.99rem) { .fi-main-ctn { background-color: var(--dlt-tarjeta); border-top: 1px solid var(--dlt-linea); } }
.fi-main { padding-block: 2rem 3rem; }
.fi-header-heading { font-size: 1.625rem; font-weight: 700; letter-spacing: -.02em; }
.fi-page-main { gap: 1.75rem; }

/* Bloques y tablas: borde de 1 px, sin sombra; cabeceras sin fondo. */
.fi-section, .fi-ta-ctn, .fi-wi-stats-overview-stat, .fi-fo-repeater-item {
    box-shadow: none; --tw-ring-color: transparent; border: 1px solid var(--dlt-linea); border-radius: 1rem;
    background-color: var(--dlt-tarjeta);
}
.fi-section-header { border-bottom: 1px solid var(--dlt-linea); }
.fi-section.fi-collapsed .fi-section-header { border-bottom: 0; }
.fi-section-header-heading { font-size: 1.0625rem; font-weight: 700; letter-spacing: -.01em; color: var(--gray-950); }
.dark .fi-section-header-heading { color: #fff; }
.fi-ta-header-toolbar, .fi-ta-header { border-color: var(--dlt-linea); }
.fi-ta-table > thead > tr { background-color: transparent; }
.fi-ta-header-cell { font-weight: 600; }
.fi-ta-table > tbody > tr { border-color: var(--dlt-linea); }

/* Botón primario con el color de la marca tal cual (#9c5a2c): la paleta que genera el panel lo aclaraba a un naranja
   claro con letra blanca casi ilegible (2.2:1). Blanco sobre #9c5a2c = 5.9:1 (AA). */
.fi-btn.fi-color-primary:not(.fi-outlined):not(.fi-link) { background-color: #9c5a2c; color: #fff; }
.fi-btn.fi-color-primary:not(.fi-outlined):not(.fi-link):hover { background-color: #86491f; }
.fi-btn.fi-color-primary:not(.fi-outlined):not(.fi-link) .fi-icon { color: #fff; }

/* Botones y campos más redondeados (pedido de Bas, 27-sep: «paneles un poco más circulares»). */
.fi-btn { border-radius: .625rem; }
.fi-input-wrp { --tw-ring-color: var(--gray-300); border-radius: .625rem; }
.dark .fi-input-wrp { --tw-ring-color: rgb(255 255 255 / .15); }
.fi-input-wrp .fi-input { padding-block: .5rem; }
.fi-modal-window { border: 1px solid var(--dlt-linea); border-radius: 1.25rem; }
.fi-dropdown-panel { border-radius: .875rem; }
.fi-modal-close-overlay { backdrop-filter: blur(2px); }

/* Etiqueta dentro del campo (como el checkout de Bas): en reposo ocupa el sitio del texto; al enfocar o con valor
   sube al borde. Estado seguro = arriba: solo baja si el campo es de texto, está vacío y sin foco
   (tema/campos.js pone placeholder=" " para poder preguntarlo con :placeholder-shown). */
.fi-fo-field.dlt-flota { position: relative; }
.fi-fo-field.dlt-flota > .fi-fo-field-label-col {
    position: absolute; z-index: 2; top: 0; inset-inline-start: .625rem; max-width: calc(100% - 1.25rem);
    height: auto; padding: 0; pointer-events: none; transform: translateY(-50%);
}
.fi-fo-field.dlt-flota .fi-fo-field-label-ctn { pointer-events: auto; }
.fi-fo-field.dlt-flota .fi-fo-field-label {
    padding-inline: .3rem; border-radius: .25rem; background-color: var(--dlt-tarjeta);
    font-size: .75rem; line-height: 1rem; transition: font-size .15s ease, color .15s ease;
}
.fi-fo-field.dlt-flota .fi-fo-field-label-content { color: var(--gray-600); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dark .fi-fo-field.dlt-flota .fi-fo-field-label-content { color: var(--gray-400); }
.fi-fo-field.dlt-flota:focus-within .fi-fo-field-label-content { color: #9c5a2c; }
.dark .fi-fo-field.dlt-flota:focus-within .fi-fo-field-label-content { color: #d9a37a; }
.fi-fo-field.dlt-flota > .fi-fo-field-label-col { transition: top .15s ease, transform .15s ease; }
.fi-fo-field.dlt-flota:has(.fi-input[placeholder=" "]:placeholder-shown:not(:focus)) > .fi-fo-field-label-col { top: 1.3125rem; }
.fi-fo-field.dlt-flota:has(.fi-input[placeholder=" "]:placeholder-shown:not(:focus)) .fi-fo-field-label { font-size: .875rem; background-color: transparent; }
.fi-fo-field.dlt-flota:has(.fi-input[placeholder=" "]:placeholder-shown:not(:focus)) .fi-fo-field-label-content { color: var(--gray-500); font-weight: 400; }
.fi-fo-field.dlt-flota:has(.fi-input-wrp-prefix):has(.fi-input[placeholder=" "]:placeholder-shown:not(:focus)) > .fi-fo-field-label-col { inset-inline-start: 2.25rem; }
.fi-fo-field.dlt-flota > .fi-fo-field-content-col { padding-top: 0; }
.fi-sc-form, .fi-sc { row-gap: 1.375rem; }
.fi-dropdown-panel { --tw-ring-color: var(--dlt-linea); }

/* Pantallas sueltas (login, perfil): tarjeta con borde fino sobre el fondo gris. */
.fi-simple-layout { background-color: var(--dlt-fondo); }
.fi-simple-main { box-shadow: none; border: 1px solid var(--dlt-linea); background-color: var(--dlt-tarjeta); border-radius: 1.25rem; }

/* Ventana de Ajustes (menú del usuario). */
.dlt-ajustes-lista { display: grid; gap: .5rem; }
.dlt-ajustes .fi-modal-heading { font-size: 1.25rem; font-weight: 700; letter-spacing: -.015em; }
.dlt-ajustes-item {
    display: flex; align-items: center; gap: .875rem; padding: .75rem .875rem; border-radius: .875rem;
    border: 1px solid var(--dlt-linea); transition: background-color .1s ease;
}
.dlt-ajustes-item:hover, .dlt-ajustes-item:focus-visible { background-color: var(--dlt-fondo); outline: none; }
.dlt-ajustes-icono { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: .625rem; background-color: var(--dlt-fondo); color: var(--gray-700); flex-shrink: 0; }
.dark .dlt-ajustes-icono { color: var(--gray-200); }
.dlt-ajustes-icono svg, .dlt-ajustes-flecha svg { width: 1.25rem; height: 1.25rem; }
.dlt-ajustes-texto { display: grid; flex: 1; min-width: 0; }
.dlt-ajustes-titulo { font-weight: 600; font-size: .9375rem; color: var(--gray-950); }
.dark .dlt-ajustes-titulo { color: #fff; }
.dlt-ajustes-detalle { font-size: .8125rem; color: var(--gray-600); }
.dark .dlt-ajustes-detalle { color: var(--gray-400); }
.dlt-ajustes-flecha { color: var(--gray-400); }

.fi-no > *:not(:last-child) { display: none; }

/* Avisos: abajo al centro, uno a la vez, color pleno. Verde = bien, rojo = fallo (blanco sobre 700: contraste AA). */
.fi-no.fi-vertical-align-end { padding-bottom: 1.25rem; }
.fi-no-notification.fi-status-success, .fi-no-notification.fi-status-danger { color: #fff; --tw-ring-color: transparent; }
:root .fi-no-notification.fi-status-success, .dark .fi-no-notification.fi-status-success { background-color: #15803d; }
:root .fi-no-notification.fi-status-danger, .dark .fi-no-notification.fi-status-danger { background-color: #b91c1c; }
.fi-no-notification.fi-status-success .fi-no-notification-title, .fi-no-notification.fi-status-danger .fi-no-notification-title,
.fi-no-notification.fi-status-success .fi-no-notification-icon, .fi-no-notification.fi-status-danger .fi-no-notification-icon,
.fi-no-notification.fi-status-success .fi-no-notification-close-btn, .fi-no-notification.fi-status-danger .fi-no-notification-close-btn { color: #fff; }
.fi-no-notification.fi-status-success .fi-no-notification-body, .fi-no-notification.fi-status-danger .fi-no-notification-body { color: rgb(255 255 255 / .9); }

/* Grupo dentro de grupo en las piezas de la ficha (tema/grupos.js) */
.dlt-anidada tr.dlt-padre > td { padding: .75rem 1rem .5rem; background-color: var(--dlt-fondo); border-top: 1px solid var(--dlt-linea); }
.dlt-padre-btn { display: flex; align-items: center; gap: .625rem; width: 100%; text-align: start; font-weight: 600; font-size: .9375rem; }
.dlt-padre-n { font-weight: 400; font-size: .8125rem; color: var(--gray-500); }
.dlt-padre-btn svg { width: 1.125rem; height: 1.125rem; margin-inline-start: auto; color: var(--gray-400); transition: transform .15s; }
.dlt-plegado .dlt-padre-btn svg { transform: rotate(180deg); }
.dlt-anidada tr.dlt-oculta { display: none !important; }
.dlt-anidada tr.fi-ta-group-header-row .fi-ta-group-header { padding-inline-start: 2.25rem; }
.dlt-anidada tr.fi-ta-group-header-row.dlt-sin-hijo { display: none; }

/* Visor de fotos (tema/visor.js): miniatura clicable, foto grande con zoom. */
[data-dlt-grande] { cursor: zoom-in; }
[data-dlt-grande]:focus-visible { outline: 2px solid var(--primary-500); outline-offset: 2px; }
html.dlt-sin-scroll { overflow: hidden; }
.dlt-visor { position: fixed; inset: 0; z-index: 60; display: none; background: rgba(12, 10, 9, .92); color: #fff; user-select: none; }
.dlt-visor.dlt-abierto { display: block; }
.dlt-visor-barra { position: absolute; top: 0; inset-inline: 0; z-index: 2; display: flex; align-items: center; gap: .25rem; padding: .625rem .75rem; background: linear-gradient(rgba(0,0,0,.55), transparent); }
.dlt-visor-t { font-weight: 600; font-size: .9375rem; margin-inline-end: .5rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dlt-visor-n { font-size: .8125rem; color: rgba(255,255,255,.7); margin-inline-end: auto; white-space: nowrap; }
.dlt-visor-barra button, .dlt-visor-barra a { display: inline-flex; align-items: center; justify-content: center; min-width: 2.5rem; height: 2.5rem; padding: 0 .5rem; border-radius: .5rem; color: #fff; font-size: .8125rem; font-variant-numeric: tabular-nums; }
.dlt-visor-barra button:hover, .dlt-visor-barra a:hover, .dlt-visor-flecha:hover { background: rgba(255,255,255,.14); }
.dlt-visor svg { width: 1.25rem; height: 1.25rem; }
.dlt-visor-lienzo { position: absolute; inset: 3.75rem 0 1rem; display: flex; align-items: center; justify-content: center; overflow: hidden; touch-action: none; }
.dlt-visor-lienzo img { max-width: calc(100% - 7rem); max-height: 100%; object-fit: contain; transform-origin: center; transition: transform .12s ease-out; cursor: zoom-in; touch-action: none; background: #fff; border-radius: .25rem; }
.dlt-visor.dlt-ampliada img { cursor: grab; transition: none; }
.dlt-visor.dlt-cargando img { opacity: .35; }
.dlt-visor-flecha { position: absolute; top: 50%; z-index: 2; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border-radius: 9999px; background: rgba(255,255,255,.08); color: #fff; }
.dlt-visor-ant { inset-inline-start: .75rem; }
.dlt-visor-sig { inset-inline-end: .75rem; }
.dlt-visor.dlt-una .dlt-visor-flecha { display: none; }
@media (max-width: 640px) {
    .dlt-visor-lienzo img { max-width: 100%; }
    .dlt-visor-flecha { top: auto; bottom: 1rem; transform: none; }
    .dlt-visor-barra a { display: none; }
}

/* Filtro de material en la misma fila que «Agrupar por / Ascendente» (Bas, 28-09): sin bloque «Filtros» aparte.
   La barra se vuelve «contents» para que sus hijos y el filtro compartan una sola fila flexible. */
.fi-ta-header-ctn:has(> .fi-ta-filters-above-content-ctn) { display: flex; flex-wrap: wrap; align-items: center; }
.fi-ta-header-ctn:has(> .fi-ta-filters-above-content-ctn) > .fi-ta-header { flex: 1 1 100%; }
.fi-ta-header-ctn:has(> .fi-ta-filters-above-content-ctn) > .fi-ta-header-toolbar { display: contents; }
.fi-ta-header-ctn:has(> .fi-ta-filters-above-content-ctn) > .fi-ta-header-toolbar > .fi-ta-actions { order: 1; padding: .75rem 0 .75rem 1rem; }
.fi-ta-header-ctn > .fi-ta-filters-above-content-ctn { order: 2; flex: 0 1 18rem; min-width: 12rem; padding: .5rem 1rem; border: 0; }
.fi-ta-header-ctn:has(> .fi-ta-filters-above-content-ctn) > .fi-ta-header-toolbar > :not(.fi-ta-actions) { order: 3; margin-inline-start: auto; padding: .75rem 1rem; }
.fi-ta-filters-above-content-ctn .fi-ta-filters { padding: 0; gap: 0; }
.fi-ta-filters-above-content-ctn .fi-ta-filters-header { display: none; }

/* Cifras de cada título de agrupación y del total, bajo su columna (Bas, 28-09). */
td.dlt-cifra { text-align: end; white-space: nowrap; font-variant-numeric: tabular-nums; font-size: .875rem; padding: .5rem .75rem; vertical-align: middle; }
.dlt-anidada tr.dlt-padre > td.dlt-cifra { padding: .75rem .75rem .5rem; font-weight: 600; }
tr.dlt-total-ficha td { font-weight: 700; border-top: 2px solid currentColor; padding-block: .75rem; font-size: .875rem; }
tr.dlt-total-ficha td:first-child { padding-inline: 1rem; }
.dlt-total-n { font-weight: 400; font-size: .8125rem; color: var(--gray-500); margin-inline-start: .625rem; }

/* Historial de la ficha en el panel lateral (28-09) */
.dlt-hist { display: flex; flex-direction: column; }
.dlt-hist-fila { padding: .75rem 0; border-bottom: 1px solid var(--dlt-linea); }
.dlt-hist-fila:first-child { padding-top: 0; }
.dlt-hist-cabeza { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.dlt-hist-pieza { font-weight: 500; font-size: .875rem; }
.dlt-hist-detalle { margin-top: .25rem; font-size: .8125rem; color: var(--gray-600); overflow-wrap: anywhere; }
.dark .dlt-hist-detalle { color: var(--gray-400); }
.dlt-hist-pie { margin-top: .25rem; font-size: .75rem; color: var(--gray-500); }
.dlt-hist-mas { padding: 1rem 0; display: flex; justify-content: center; }
.dlt-hist-vacio { padding: 1rem 0; font-size: .8125rem; color: var(--gray-500); text-align: center; }
