/* =====================================================================
   AvanzaPI · Reskin — capa visual moderna
   ---------------------------------------------------------------------
   Override puramente visual sobre SmartAdmin 4.5.1 (Bootstrap 4).
   NO modifica markup ni JS: misma estructura, botones, zonas y
   navegación. Solo "lavado de cara": tipografía Nunito, paleta verde
   de marca, esquinas redondeadas, sombras suaves y más aire.

   Se carga el último en headerCss.blade.php para ganar por cascada.
   ===================================================================== */

:root {
    /* Marca */
    --avz-brand:        #8dc043;
    --avz-brand-hover:  #7eb133;
    /* brand-strong se usa sobre todo como TEXTO/icono sobre blanco: debe dar
       ≥4.5:1 (antes #5f9a2c = 3.4:1). brand-deep es el extremo oscuro de los
       gradientes con texto blanco encima (6.4:1). */
    --avz-brand-strong: #4a7d22;
    --avz-brand-deep:   #3e6a1b;
    --avz-brand-soft:   #eef6e1;
    --avz-brand-ring:   rgba(141, 192, 67, .40);
    --avz-on-brand:     #17270d;

    /* Superficies */
    --avz-bg:        #f3f6f2;
    --avz-surface:   #ffffff;
    --avz-surface-2: #f7faf5;
    --avz-row-hover: #f5faef;
    --avz-input-bg:  #fbfcf9;
    --avz-input-disabled-bg: #e4e8e3;

    /* Líneas */
    --avz-line:        #e9eee8;
    --avz-line-strong: #dde4db;

    /* Tinta. ink-3 es texto secundario real (cabeceras de tabla, placeholders,
       paginación…): necesita ≥4.5:1 sobre blanco Y sobre surface-2
       (antes #8a958d = 3.1:1 / 2.95:1; ahora 5.1:1 / 4.8:1). */
    --avz-ink:   #1e2a22;
    --avz-ink-2: #566159;
    --avz-ink-3: #667169;

    /* Estados: cada ink debe dar ≥4.5:1 sobre su bg suave y sobre blanco */
    --avz-ok-bg:   #e6f5ea; --avz-ok-ink:   #257a3c;
    --avz-info-bg: #e7f0fb; --avz-info-ink: #2760a8;
    --avz-warn-bg: #fcf1e1; --avz-warn-ink: #92600d;
    --avz-dang-bg: #fcece9; --avz-dang-ink: #b8362e;
    --avz-chip-bg: #eef1ec; --avz-chip-ink: #5a655c;

    /* Formas */
    --avz-radius:    16px;
    --avz-radius-md: 12px;
    --avz-radius-sm: 10px;
    --avz-shadow:     0 1px 2px rgba(20,40,25,.05), 0 6px 22px rgba(20,40,25,.05);
    --avz-shadow-pop: 0 12px 34px rgba(20,40,25,.16);
}

/* Sin scrollbar en el menú lateral (en ambos modos). El tema scrollea el menú
   con slimScroll (un div .slimScrollBar dibujado por JS, no una barra nativa),
   así que hay que ocultar ese div; el scroll con rueda sigue funcionando. */
.page-sidebar .slimScrollBar,
.page-sidebar .slimScrollRail { display: none !important; }
.page-sidebar,
#js-primary-nav,
.page-sidebar .primary-nav { scrollbar-width: none; }
.page-sidebar::-webkit-scrollbar,
#js-primary-nav::-webkit-scrollbar,
.page-sidebar .primary-nav::-webkit-scrollbar { width: 0 !important; height: 0 !important; }

/* Botón "Guardar" de gestión documental: traía azul hardcodeado → marca (ambos modos). */
.btn-save,
.btn-save.btn-primary {
    background-color: var(--avz-brand) !important;
    border-color: var(--avz-brand) !important;
    color: var(--avz-on-brand) !important;
}
.btn-save:hover {
    background-color: var(--avz-brand-hover) !important;
    border-color: var(--avz-brand-hover) !important;
}

/* ====================== TIPOGRAFÍA ====================== */
body,
.page-content,
.btn,
.form-control,
.custom-select,
table.dataTable,
.modal-content,
.dropdown-menu,
.nav-menu {
    font-family: 'Nunito', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
    -webkit-font-smoothing: antialiased;
}

::selection { background: var(--avz-brand-ring); }

/* ====================== FONDO GENERAL ====================== */
body.mod-skin-light,
body {
    background: var(--avz-bg) !important;
    color: var(--avz-ink);
}
.page-content {
    background: var(--avz-bg);
}

/* Scrollbars suaves */
.page-content ::-webkit-scrollbar,
.dataTables_scrollBody::-webkit-scrollbar { width: 10px; height: 10px; }
.page-content ::-webkit-scrollbar-thumb,
.dataTables_scrollBody::-webkit-scrollbar-thumb {
    background: var(--avz-line-strong);
    border-radius: 999px;
    border: 3px solid transparent;
    background-clip: padding-box;
}

/* ====================== PANELES / TARJETAS ====================== */
.panel,
.panel.card-with-lights {
    background: var(--avz-surface);
    border: 0px solid var(--avz-line);
    border-radius: var(--avz-radius);
    box-shadow: var(--avz-shadow);
    /* overflow visible para que los desplegables del datatable (columnas,
       acciones de fila, etc.) no se corten al salir del panel. El contenido
       va con padding, así que las esquinas redondeadas se respetan igual. */
    overflow: visible !important;
}
/* SmartAdmin pinta una barra de "luces" superior; la quitamos */
.panel.card-with-lights::before,
.panel.card-with-lights::after { display: none !important; }

.panel-hdr {
    border-radius: var(--avz-radius) var(--avz-radius) 0 0;
    border-bottom: 1px solid var(--avz-line);
    /* Algunas vistas (hubs de módulo) inyectan el color de empresa con opacidad
       en la cabecera, que queda turbia/oscura. Forzamos una cabecera limpia. */
    background: var(--avz-surface-2) !important;
    background-image: none !important;
    color: var(--avz-ink) !important;
}
.panel-hdr h2,
.panel-hdr .panel-title,
.panel-hdr > div {
    color: var(--avz-ink) !important;
    font-weight: 800;
}
.panel-hdr [class*="fa-"],
.panel-hdr .fal { color: var(--avz-brand-strong) !important; }
.panel-container { border-radius: 0 0 var(--avz-radius) var(--avz-radius); }
.panel-content { padding: 18px 20px; }
/* Edit de cliente: los avisos #aviso / #aviso_cif van dentro de un
   .panel-container > .panel-content que reservaba el padding (≈36px c/u) aun
   estando ocultos (.d-none) → hueco vacío arriba. Los colapsamos mientras el
   aviso esté oculto; al mostrarse (sin .d-none) vuelven a ocupar su espacio. */
.panel-container:has(> .panel-content > #aviso.d-none),
.panel-container:has(> .panel-content > #aviso_cif.d-none) { display: none !important; }

/* La fila .fadeinup que envuelve el datatable no necesita la sombra del panel duplicada */
.row.fadeinup > [class^="col"] > .panel { margin-bottom: 0; }

/* ====================== BOTONES ====================== */
.btn {
    border-radius: var(--avz-radius-sm);
    font-weight: 700;
    letter-spacing: .005em;
    transition: background .14s ease, box-shadow .14s ease, color .14s ease, border-color .14s ease;
}
.btn-sm { border-radius: 9px; }

.btn-primary {
    background: var(--avz-brand);
    border-color: var(--avz-brand);
    color: var(--avz-on-brand);
    box-shadow: 0 2px 8px rgba(141,192,67,.35);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:not(:disabled):not(.disabled):active {
    background: var(--avz-brand-hover) !important;
    border-color: var(--avz-brand-hover) !important;
    color: var(--avz-on-brand) !important;
    box-shadow: 0 4px 14px rgba(141,192,67,.40);
}

.btn-success {
    background: var(--avz-brand);
    border-color: var(--avz-brand);
    color: var(--avz-on-brand);
}
.btn-success:hover,
.btn-success:focus,
.btn-success:active {
    background: var(--avz-brand-hover) !important;
    border-color: var(--avz-brand-hover) !important;
    color: var(--avz-on-brand) !important;
}

/* Secundarios / por defecto: contorno suave */
.btn-default,
.btn-secondary,
.btn-outline-secondary,
.btn-light {
    background: var(--avz-surface);
    border: 1px solid var(--avz-line-strong);
    color: var(--avz-ink-2);
}
.btn-default:hover,
.btn-secondary:hover,
.btn-outline-secondary:hover,
.btn-light:hover {
    background: var(--avz-surface-2) !important;
    border-color: var(--avz-line-strong) !important;
    color: var(--avz-ink) !important;
}

.btn-warning {
    background: var(--avz-warn-bg);
    border-color: var(--avz-warn-ink);
    color: var(--avz-warn-ink);
}
.btn-warning:hover { filter: brightness(.98); color: var(--avz-warn-ink); }

.btn-danger {
    background: var(--avz-dang-bg);
    border-color: var(--avz-dang-ink);
    color: var(--avz-dang-ink);
}
.btn-danger:hover { filter: brightness(.98); color: var(--avz-dang-ink); }

/* Focus ring de marca */
.btn:focus,
.form-control:focus,
.custom-select:focus {
    box-shadow: 0 0 0 3px var(--avz-brand-ring) !important;
    outline: none;
}

/* ===== Foco de teclado visible (accesibilidad) =====
   El tema mata el outline en ~23 reglas repartidas por sus bundles, así que
   un usuario de teclado no sabía dónde estaba. Outline global en
   :focus-visible (solo navegación por teclado; el click no lo dispara en
   botones/enlaces). El !important es necesario para ganar a reglas del tema
   más específicas tipo `.btn:focus { outline: none }`.
   brand-strong da ≥3:1 sobre blanco y superficies claras (y en oscuro el
   token es un verde claro que contrasta sobre los fondos oscuros). */
:focus-visible {
    outline: 2px solid var(--avz-brand-strong) !important;
    outline-offset: 2px;
    /* El tema pone transition: all .3s en botones y el anillo aparecía con
       fundido; el indicador de foco debe ser instantáneo. */
    transition: none !important;
}
/* Los campos de formulario ya señalan el foco con el anillo box-shadow de
   arriba (y :focus-visible salta también al hacer click en un input):
   sin outline duplicado. */
.form-control:focus-visible,
.custom-select:focus-visible,
textarea:focus-visible,
select:focus-visible,
.p-inputtext:focus-visible,
.select2-search__field:focus-visible {
    outline: none !important;
}

/* Botones-icono (solo icono) de la barra de herramientas del datatable */
.dt-buttons .btn-icon {
    border-radius: 9px;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
/* Botones de texto de la barra (Crear, Dar de baja…): más compactos */
.dt-buttons .btn-sm {
    height: 32px;
    padding: 0 11px;
    font-size: 0.92rem;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
/* ===== Toolbar del datatable: botones minimalistas =====
   Estilo "ghost": fondo transparente, texto neutro e icono de color
   semántico (intuitivo). Solo el botón principal (Crear, btn-success)
   va relleno como única acción destacada. Cubre también los botones
   personalizados, que usan las clases btn-* estándar. */
.dt-buttons .btn {
    background: transparent !important;
    border: 1px solid transparent !important;
    color: var(--avz-ink-2) !important;
    box-shadow: none !important;
    font-weight: 700;
}
.dt-buttons .btn:hover:not(:disabled):not(.disabled) {
    background: rgba(95,154,44,0.18) !important;
    color: var(--avz-ink) !important;
}
.dt-buttons .btn:disabled,
.dt-buttons .btn.disabled { opacity: .45; }

/* Iconos en tono neutro por defecto y de color según la semántica */
.dt-buttons .btn > [class*="fa-"] { color: var(--avz-ink-3); }
.dt-buttons .btn-danger > [class*="fa-"]  { color: var(--avz-dang-ink); }
.dt-buttons .btn-warning > [class*="fa-"] { color: var(--avz-warn-ink); }
.dt-buttons .btn-info > [class*="fa-"]    { color: var(--avz-info-ink); }

/* Hover con tinte semántico suave en los botones contextuales */
.dt-buttons .btn-danger:hover:not(:disabled):not(.disabled)  { background: var(--avz-dang-bg) !important; color: var(--avz-dang-ink) !important; }
.dt-buttons .btn-warning:hover:not(:disabled):not(.disabled) { background: var(--avz-warn-bg) !important; color: var(--avz-warn-ink) !important; }
.dt-buttons .btn-info:hover:not(:disabled):not(.disabled)    { background: var(--avz-info-bg) !important; color: var(--avz-info-ink) !important; }

/* Acción principal (Crear): la única destacada, rellena en verde de marca */
.dt-buttons .btn-success {
    background: var(--avz-brand) !important;
    border-color: var(--avz-brand) !important;
    color: var(--avz-on-brand) !important;
}
.dt-buttons .btn-success > [class*="fa-"] { color: var(--avz-on-brand); }
.dt-buttons .btn-success:hover:not(:disabled):not(.disabled) {
    background: var(--avz-brand-hover) !important;
    color: var(--avz-on-brand) !important;
}

/* ====================== BADGES → PÍLDORAS ====================== */
.badge {
    border-radius: 999px;
    font-weight: 800;
    font-size: 0.92rem;
    letter-spacing: .01em;
    padding: .42em .85em;
    line-height: 1.3;
}
.badge-primary {
    background: var(--avz-brand-soft);
    color: var(--avz-brand-strong);
}
.badge-success { background: var(--avz-ok-bg);   color: var(--avz-ok-ink); }
.badge-info    { background: var(--avz-info-bg); color: var(--avz-info-ink); }
.badge-warning { background: var(--avz-warn-bg); color: var(--avz-warn-ink); }
.badge-danger  { background: var(--avz-dang-bg); color: var(--avz-dang-ink); }
.badge-secondary,
.badge-light {
    background: var(--avz-chip-bg);
    color: var(--avz-chip-ink);
}

/* ===== Contraste: evitar texto blanco sobre fondos suaves =====
   Al suavizar fondos de badges/botones, el .text-white del tema dejaba
   textos/enlaces ilegibles (blanco sobre claro). Se fuerza el color de
   tinta del propio componente.
   OJO: solo los enlaces internos. NO tocar el color del badge en sí: los
   badges con fondo sólido del tema (bg-secondary, bg-danger… en Estado)
   usan .text-white correctamente. El enlace hereda el color del badge:
   blanco en badges sólidos, verde de marca en badges suaves. */
.badge a,
.badge .badge-link,
a.badge-link { color: inherit !important; }

/* Hover de los badges clicables ("Pinchar para filtrar"): el tema los
   ponía azul/morado/gris oscuro. Los pasamos a la marca, legibles. */
.badge-hover-primary:hover,
.badge-hover-success:hover {
    background-color: var(--avz-brand) !important;
    color: var(--avz-on-brand) !important;
}
.badge-hover-danger:hover {
    background-color: var(--avz-dang-ink) !important;
    color: #fff !important;
}
.badge-hover-dark:hover {
    background-color: var(--avz-ink) !important;
    color: #fff !important;
}
.badge-hover-primary:hover .badge-link,
.badge-hover-success:hover .badge-link { color: var(--avz-on-brand) !important; }
.badge-hover-danger:hover .badge-link,
.badge-hover-dark:hover .badge-link { color: #fff !important; }

.btn-warning,
.btn-warning.text-white { color: var(--avz-warn-ink) !important; }
.btn-danger,
.btn-danger.text-white { color: var(--avz-dang-ink) !important; }
.btn-info,
.btn-info.text-white { color: var(--avz-info-ink) !important; }
.btn-secondary.text-white,
.btn-light.text-white,
.btn-default.text-white { color: var(--avz-ink-2) !important; }

/* Iconos de cierre en cabeceras de color (eran demasiado tenues) */
.modal-header .close { opacity: .85; text-shadow: none; }
.modal-header.bg-warning .close,
.modal-header.bg-success .close,
.modal-header.bg-info .close,
.modal-header.bg-danger .close,
.modal-header.bg-primary .close { opacity: 1; }

/* ====================== INPUTS / FILTROS ====================== */
.form-control,
.custom-select {
    border-radius: var(--avz-radius-sm);
    border: 1px solid var(--avz-line-strong);
    background: var(--avz-input-bg);
    color: var(--avz-ink);
    /* El tema deja los inputs en 0.8125rem (10.5px con raíz 13px) */
    font-size: .95rem;
    box-shadow: none !important;
}
.form-control:focus,
.custom-select:focus {
    background: var(--avz-surface);
    border-color: var(--avz-brand);
}
.form-control::placeholder { color: var(--avz-ink-3); }

/* Campos no editables: fondo más apagado y tinta atenuada para que se
   distingan de los editables (el gris disabled de Bootstrap era casi
   idéntico a --avz-input-bg) */
.form-control:disabled,
.form-control[readonly],
.custom-select:disabled,
select.form-control:disabled {
    background: var(--avz-input-disabled-bg);
    border-color: var(--avz-line);
    color: var(--avz-ink-3);
    opacity: 1;
}
.select2-container--default.select2-container--disabled .select2-selection--single,
.select2-container--default.select2-container--disabled .select2-selection--multiple {
    background: var(--avz-input-disabled-bg);
}

/* Buscador general del datatable */
.dataTables_filter input.form-control {
    border-radius: var(--avz-radius-sm) !important;
    background: var(--avz-input-bg);
}

/* Select2 */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border-radius: var(--avz-radius-sm);
    border: 1px solid var(--avz-line-strong);
    background: var(--avz-input-bg);
}
.select2-container--default .select2-selection--multiple {
    min-height: calc(1.47em + 1rem + 2px);
}
.select2-container--default .select2-selection__rendered,
.select2-container--default .select2-selection__placeholder,
.select2-results__option { font-size: .95rem; }
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted {
    background: var(--avz-brand) !important;
    color: var(--avz-on-brand) !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: var(--avz-brand-soft);
    border-color: var(--avz-brand-soft);
    color: var(--avz-brand-strong);
    border-radius: 999px;
}

/* ====================== TABLA ====================== */
table.dataTable {
    border-collapse: separate;
    border-spacing: 0;
}
/* Tamaños en rem para que el datatable escale con el "Tamaño de fuente
   global" (clases root-text-* sobre <html>). 1rem = font-size raíz. */
table.dataTable thead th,
table.dataTable thead td {
    text-transform: uppercase;
    /* Raíz de la app = 13px → 0.92rem ≈ 12px, el suelo de legibilidad
       (el 0.73rem anterior quedaba en 9.5px) */
    font-size: 0.92rem;
    font-weight: 800;
    letter-spacing: .04em;
    color: var(--avz-ink-3);
    background: var(--avz-surface-2);
    border-top: none;
    border-bottom: none;
    padding: 0.47rem 0.78rem;
    vertical-align: middle;
}
table.dataTable tbody td {
    border-top: none;
    border-bottom: none;
    padding: 0.28rem 0.7rem;
    vertical-align: middle;
    color: var(--avz-ink-2);
    font-size: 1rem;
}
/* Badges dentro de la tabla, proporcionales al texto compacto de las celdas */
table.dataTable tbody td .badge { font-size: 0.88rem; }
table.dataTable tbody tr { background: var(--avz-surface); }
table.dataTable tbody tr:hover { background: var(--avz-row-hover); }
table.dataTable tbody tr.selected,
table.dataTable tbody tr.selected td {
    background: rgba(95,154,44,0.28) !important;
    color: var(--avz-ink);
}
/* Fila de baja seleccionada: mantener el rojo pero más saturado para indicar selección */
table.dataTable tbody tr.discharge.selected,
table.dataTable tbody tr.discharge.selected td {
    background: rgba(207,71,63,0.48) !important;
}
table.dataTable tbody td strong { color: var(--avz-ink); font-weight: 800; }

/* Indicadores de orden en verde */
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc { color: var(--avz-brand-strong); }

/* Botones de acción dentro de la tabla → iconos discretos (ghost) */
table.dataTable tbody td .btn-xs {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: var(--avz-ink-3) !important;
    border-radius: 6px;
    /* ancho auto con mínimo: los botones solo-icono quedan ~24px y los que
       llevan texto (p. ej. "Entrar como") se ensanchan para no cortarse. */
    min-width: 24px;
    width: auto;
    height: 22px;
    padding: 0 5px;
    margin: 0;
    font-size: 12px;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
table.dataTable tbody td .btn-xs:hover,
table.dataTable tbody td .btn-xs:focus {
    background: var(--avz-brand-soft) !important;
    color: var(--avz-brand-strong) !important;
}
/* Contador sobre los iconos de acción (documentos, notas…): el badge se
   posicionaba absoluto SOBRE el icono y, con el botón compacto, lo tapaba.
   Lo mostramos como una pastilla pequeña a la derecha del icono (icono
   visible) y dejamos que ese botón se ensanche para alojarla. */
table.dataTable tbody td .btn-xs:has(.badge) {
    width: auto !important;
    flex: 0 0 auto !important;
    padding: 0 4px;
    gap: 2px;
}
table.dataTable tbody td .btn-xs .badge,
table.dataTable tbody td .btn-xs .badge-icon {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    margin: 0 0 0 1px !important;
    padding: 0 4px !important;
    min-width: 0 !important;
    width: auto !important;
    height: 16px;
    line-height: 16px;
    font-size: 10.5px !important;
    font-weight: 800;
    border-radius: 999px !important;
}
/* Las acciones venían apiladas en vertical (btn-group-vertical) y disparaban
   la altura de la fila. Las ponemos en horizontal para filas mucho más bajas. */
table.dataTable tbody td .btn-group-vertical {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    width: max-content;
    min-width: max-content;
}
table.dataTable tbody td .btn-group-vertical > .btn { width: 24px; flex: 0 0 24px; }
table.dataTable tbody td .btn-group { box-shadow: none; }

/* Copiar/filtrar haciendo clic sobre el dato (sustituye al antiguo botón).
   El resaltado se aplica SOLO al dato (span que lo abraza), no a toda la celda. */
.copy-btn { display: none !important; }
.avz-copy-target {
    cursor: pointer;
    border-radius: 6px;
    padding: 1px 6px;
    margin: -1px -6px;
    transition: background .12s ease, box-shadow .12s ease;
}
table.dataTable tbody td .avz-copy-target:hover {
    background: var(--avz-brand-soft);
    box-shadow: inset 0 0 0 1px var(--avz-brand-ring);
}
/* Feedback "✓ Copiado" / "Filtrado" junto al dato */
.avz-copy-target.avz-flash { position: relative; background: var(--avz-brand-soft); }
.avz-copy-target.avz-flash::after {
    content: attr(data-avz-flash);
    position: absolute;
    bottom: calc(100% + 4px);
    left: 50%;
    transform: translateX(-50%);
    background: var(--avz-brand-strong);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .01em;
    padding: 2px 8px;
    border-radius: 999px;
    pointer-events: none;
    white-space: nowrap;
    z-index: 5;
    box-shadow: 0 4px 12px rgba(20,40,25,.25);
    animation: avzFlashIn .12s ease;
}
@keyframes avzFlashIn { from { opacity: 0; transform: translateX(-50%) translateY(4px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }

/* Control responsive (botón "+/-" para expandir columnas ocultas).
   Algún tema base lo pinta como una barra morada a toda altura; lo forzamos
   a un botón circular compacto de marca con geometría explícita. */
table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control::before,
table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control::before,
table.dataTable td.dtr-control::before {
    top: 50% !important;
    left: 9px !important;
    height: 18px !important;
    width: 18px !important;
    margin-top: -9px !important;
    line-height: 18px !important;
    border-radius: 999px !important;
    border: none !important;
    background-color: var(--avz-brand) !important;
    color: var(--avz-on-brand) !important;
    box-shadow: 0 2px 6px rgba(141,192,67,.40) !important;
    text-indent: 0 !important;
    font-weight: 800;
}
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td.dtr-control::before {
    background-color: var(--avz-brand-strong) !important;
    color: #fff !important;
}
/* Tinte de columna ordenada: neutro (evita el morado del tema). Se deja
   transparente para que la celda muestre SIEMPRE el color de la fila (hover,
   o el rojo de .discharge en empleados de baja); no se fuerza color en hover
   para no tapar esos fondos de fila. */
table.dataTable tbody td.sorting_1 { background-color: transparent !important; }

/* Fila de filtros (tfoot/thead inputs) */
table.dataTable thead tr:nth-child(2) th,
.dtTable tfoot th { background: var(--avz-surface); }

/* ====================== PAGINACIÓN ====================== */
.dataTables_paginate .pagination { gap: 4px; }
.pagination .page-item .page-link {
    border: 1px solid transparent;
    border-radius: 9px;
    color: var(--avz-ink-2);
    font-weight: 700;
    font-size: .92rem !important; /* el tema lo deja en 0.825rem (10.7px) */
    min-width: 32px;
    text-align: center;
    background: transparent;
    margin: 0;
}
/* Hover en verde oscuro de marca. El !important es necesario: el tema
   (cust-theme-15) fuerza su hover azul con background-color !important. */
.pagination .page-item .page-link:hover {
    background: var(--avz-brand-strong) !important;
    color: #fff !important;
}
.pagination .page-item.active .page-link {
    background: var(--avz-brand);
    border-color: var(--avz-brand);
    color: var(--avz-on-brand);
    box-shadow: 0 2px 8px rgba(141,192,67,.30);
}
.pagination .page-item.previous .page-link,
.pagination .page-item.next .page-link {
    border: 1px solid var(--avz-line-strong);
    background: var(--avz-surface);
}
.pagination .page-item.disabled .page-link { color: var(--avz-ink-3); opacity: .6; }
.pagination .page-item.disabled .page-link:hover {
    background: var(--avz-surface) !important;
    color: var(--avz-ink-3) !important;
}

/* "Mostrar N registros" / info */
.dataTables_length select.custom-select { border-radius: 9px; height: 32px; padding: 0 8px; }
.dataTables_info { color: var(--avz-ink-3); font-weight: 600; font-size: .92rem; }
.dataTables_length, .dataTables_length select.custom-select { font-size: .92rem; }

/* ====================== SIDEBAR ====================== */
.page-sidebar {
    background: var(--avz-surface);
    border-right: 1px solid var(--avz-line);
}
#js-primary-nav,
.primary-nav { background: var(--avz-surface) !important; background-image: none !important; }

.page-sidebar .nav-menu li > a,
.nav-menu li > a {
    color: var(--avz-ink-2);
    border-radius: 0;
    margin: 1px 0;
    font-weight: 700;
    font-size: .92rem !important; /* el tema fija 0.875rem dentro de un @media */
    transition: background .14s ease, color .14s ease;
    position: relative;
}
.nav-menu li > a .nav-link-text { font-weight: 700; }
.nav-menu li > a > [class*="fa-"],
.nav-menu li > a .fal { color: var(--avz-ink-3); }

.nav-menu li > a:hover {
    background: var(--avz-surface-2);
    color: var(--avz-ink);
}
.nav-menu li.active > a,
.nav-menu li.open > a {
    background: var(--avz-brand-soft) !important;
    color: var(--avz-brand-strong) !important;
    /* Acento vertical de marca a la izquierda (sin pseudo-elemento, evita el slab de SmartAdmin) */
    box-shadow: inset 3px 0 0 var(--avz-brand);
}
/* SmartAdmin usa ::before como franja de "activo"; lo neutralizamos para que no tape el texto */
.page-sidebar .nav-menu li.active > a::before,
.nav-menu li.active > a::before { display: none !important; }
.nav-menu li.active > a > [class*="fa-"],
.nav-menu li.active > a .fal { color: var(--avz-brand-strong) !important; }

/* ====================== HEADER ====================== */
.page-header {
    background: var(--avz-surface) !important;
    background-image: none !important;
    border-bottom: 1px solid var(--avz-line);
    box-shadow: none;
}

/* ====================== MODALES ====================== */
.modal-content {
    border: none;
    border-radius: var(--avz-radius);
    box-shadow: var(--avz-shadow-pop);
    /* overflow visible: los select2 con dropdownParent dentro del modal se
       recortaban al sobresalir (p.ej. Personal en Elaboración de contratos).
       Las esquinas redondeadas se conservan redondeando el primer/último hijo. */
    overflow: visible;
}
.modal-content > :first-child {
    border-top-left-radius: var(--avz-radius);
    border-top-right-radius: var(--avz-radius);
}
.modal-content > :last-child {
    border-bottom-left-radius: var(--avz-radius);
    border-bottom-right-radius: var(--avz-radius);
}
.modal-header { border-bottom: 1px solid var(--avz-line); }
.modal-header.bg-warning { background: var(--avz-warn-bg) !important; }
.modal-header.bg-warning .modal-title,
.modal-header.bg-warning .close { color: var(--avz-warn-ink) !important; }
.modal-footer { border-top: 1px solid var(--avz-line); }

.alert-warning {
    background: var(--avz-warn-bg);
    border-color: transparent;
    color: var(--avz-warn-ink);
    border-radius: var(--avz-radius-sm);
}

/* ====================== DROPDOWNS ====================== */
.dropdown-menu {
    border: 1px solid var(--avz-line);
    border-radius: var(--avz-radius-md);
    box-shadow: var(--avz-shadow-pop);
    padding: 6px;
}
.dropdown-item { border-radius: 8px; font-weight: 600; font-size: .92rem; }
.dropdown-item:hover,
.dropdown-item:focus { background: var(--avz-surface-2); color: var(--avz-ink); }
.dropdown-item.active,
.dropdown-item:active { background: var(--avz-brand-soft); color: var(--avz-brand-strong); }

/* ===== Menú de usuario (avatar) — lavado visual =====
   IMPORTANTE: los items NO se ponen en flex; mantienen su display por
   defecto para no romper el float-right de "F11" y del email del cierre
   de sesión (si no, se salen del menú). */
.dropdown-lg {
    border: none;
    border-radius: 16px;
    box-shadow: var(--avz-shadow-pop);
    padding-bottom: 6px;
}
/* Cabecera (gradiente de marca) */
.dropdown-lg .dropdown-header.bg-trans-gradient {
    border-radius: 16px 16px 0 0;
    padding: 18px 18px 16px !important;
    margin-bottom: 4px;
}
/* Nombre y email sobre el gradiente verde: siempre en blanco (en oscuro
   quedaban en gris y no se leían sobre el verde). Se sube la especificidad
   para ganar a la regla genérica de texto de cabecera en oscuro. */
.dropdown-lg .dropdown-header.bg-trans-gradient,
.dropdown-lg .dropdown-header.bg-trans-gradient .info-card-text,
.dropdown-lg .dropdown-header.bg-trans-gradient .info-card-text *,
body.mod-skin-dark .page-header .floating-menu .dropdown-header.bg-trans-gradient .info-card-text,
body.mod-skin-dark .page-header .floating-menu .dropdown-header.bg-trans-gradient .info-card-text span { color: #fff !important; }
body.mod-skin-dark .dropdown-header.bg-trans-gradient .info-card-text .opacity-80 { color: #fff !important; opacity: 1 !important; }
.dropdown-lg .dropdown-header .profile-image {
    width: 46px;
    height: 46px;
    object-fit: cover;
    border: 2px solid rgba(255, 255, 255, .55);
}
/* Items: solo color, radio, espaciado y hover de marca (sin flex).
   width:auto evita que con el margen lateral el item (width:100% de
   Bootstrap) sobresalga del menú y el hover se vea fuera. */
.dropdown-lg .dropdown-item {
    width: auto;
    padding: 9px 16px;
    margin: 1px 8px;
    border-radius: 10px;
    font-weight: 600;
    color: var(--avz-ink-2);
}
.dropdown-lg .dropdown-item > i,
.dropdown-lg .dropdown-item > .fal {
    display: inline-block;
    width: 18px;
    margin-right: 9px;
    text-align: center;
    color: var(--avz-ink-3);
}
.dropdown-lg .dropdown-item:hover,
.dropdown-lg .dropdown-item:focus {
    background: var(--avz-brand-soft);
    color: var(--avz-brand-strong);
}
.dropdown-lg .dropdown-item:hover > i,
.dropdown-lg .dropdown-item:hover > .fal { color: var(--avz-brand-strong); }
/* F11 y email del logout: gris apagado, con su float-right intacto */
.dropdown-lg .dropdown-item .float-right { color: var(--avz-ink-3) !important; font-weight: 600; }
.dropdown-lg #logout-btn .float-right { font-size: 12px; }
/* Separadores sutiles */
.dropdown-lg .dropdown-divider {
    margin: 5px 12px !important;
    border-color: var(--avz-line);
}
/* Submenús (Mis…, Idioma) consistentes */
.dropdown-lg .dropdown-multilevel > .dropdown-item { cursor: pointer; }
.dropdown-lg .dropdown-multilevel .dropdown-menu {
    border: none;
    border-radius: 14px;
    box-shadow: var(--avz-shadow-pop);
    padding: 6px;
}
/* El submenú quedaba desencajado (con hueco). Lo pegamos al borde del menú. */
.dropdown-lg .dropdown-multilevel-left > .dropdown-menu {
    left: auto !important;
    right: 100% !important;
    top: -1px !important;
    margin: 0 2px 0 0 !important;
}

/* Tooltips */
.tooltip-inner {
    border-radius: 8px;
    font-weight: 600;
    background: var(--avz-ink);
}

/* Date range picker (bootstrap-daterangepicker): activo/seleccionado morado → verde */
.daterangepicker {
    border-radius: 14px;
    border: 1px solid var(--avz-line);
    box-shadow: var(--avz-shadow-pop);
    font-family: 'Nunito', sans-serif;
}
.daterangepicker .ranges li.active {
    background: var(--avz-brand) !important;
    color: var(--avz-on-brand) !important;
}
.daterangepicker .ranges li:hover { background: var(--avz-surface-2); }
.daterangepicker td.active,
.daterangepicker td.active:hover {
    background: var(--avz-brand) !important;
    color: var(--avz-on-brand) !important;
    border-radius: 6px;
}
.daterangepicker td.in-range { background: var(--avz-brand-soft) !important; color: var(--avz-ink) !important; }
.daterangepicker td.available:hover,
.daterangepicker th.available:hover { background: var(--avz-surface-2); border-radius: 6px; }
.daterangepicker .drp-buttons .btn { border-radius: var(--avz-radius-sm); }
.daterangepicker:after { border-bottom-color: var(--avz-surface); }

/* <code>/<kbd> (Bootstrap los pinta rosa #e83e8c) → marca, p.ej. timestamps de fichas */
code, kbd, .code {
    color: var(--avz-brand-strong);
    background: var(--avz-surface-2);
    border-radius: 6px;
    padding: 1px 6px;
    font-weight: 700;
}
kbd { background: var(--avz-ink); color: #fff; }

/* =====================================================================
   PARTE 2 · Cobertura ampliada de la librería de componentes
   (formularios, pestañas, tarjetas, alerts, wizards, breadcrumb…)
   ===================================================================== */

/* ---------------------- FORMULARIOS ---------------------- */
.form-group label,
.col-form-label,
label.control-label {
    font-weight: 800;
    font-size: 13px;
    color: var(--avz-ink-2);
    margin-bottom: 6px;
}
/* Altura unificada: la misma fórmula que usa el select2 de SmartAdmin,
   así todos los campos de un formulario quedan igual de altos */
.form-control,
textarea.form-control,
select.form-control,
.custom-select {
    min-height: calc(1.47em + 1rem + 2px);
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.form-control,
textarea.form-control,
select.form-control {
    padding-left: 13px;
    padding-right: 13px;
}
textarea.form-control { min-height: 80px; }
.form-control-sm { min-height: 32px; padding: 4px 10px; }
.form-text,
small.form-text,
.text-muted { color: var(--avz-ink-3) !important; }
.text-danger,
.invalid-feedback,
.required-asterisk { color: var(--avz-dang-ink) !important; }
.form-control.is-invalid,
.form-control.error { border-color: var(--avz-dang-ink); background: #fff; }
.form-control.is-valid { border-color: var(--avz-ok-ink); }

/* Input groups (prepend/append) */
.input-group-text {
    background: var(--avz-surface-2);
    border: 1px solid var(--avz-line);
    color: var(--avz-ink-3);
    border-radius: var(--avz-radius-sm);
}
.input-group > .form-control:not(:last-child),
.input-group > .custom-select:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group > .form-control:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }

/* Checkboxes / radios / switches (Bootstrap custom-control) */
.custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--avz-brand);
    border-color: var(--avz-brand);
}
.custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0 3px var(--avz-brand-ring);
}
.custom-control-label { font-weight: 600; color: var(--avz-ink-2); }
.custom-switch .custom-control-label::before { border-radius: 999px; }

/* Checkbox/radio nativos */
input[type="checkbox"],
input[type="radio"] { accent-color: var(--avz-brand); }

/* ---------------------- PESTAÑAS ---------------------- */
.nav-tabs {
    border-bottom: 1px solid var(--avz-line);
    gap: 2px;
}
.nav-tabs .nav-link {
    border: none;
    border-bottom: 2.5px solid transparent;
    border-radius: 0;
    color: var(--avz-ink-3);
    font-weight: 700;
    padding: 11px 16px;
    background: transparent;
}
.nav-tabs .nav-link:hover { color: var(--avz-ink-2); border-bottom-color: var(--avz-line-strong); }
.nav-tabs .nav-link.active {
    color: var(--avz-brand-strong);
    background: transparent;
    border-bottom: 2.5px solid var(--avz-brand);
}
.nav-pills .nav-link { border-radius: var(--avz-radius-sm); font-weight: 700; color: var(--avz-ink-2); }
.nav-pills .nav-link.active { background: var(--avz-brand); color: var(--avz-on-brand); } 

/* ---------------------- TARJETAS / CARDS ---------------------- */
.card {
    border: 1px solid var(--avz-line);
    border-radius: var(--avz-radius);
    box-shadow: var(--avz-shadow);
}
/* Tarjeta interior de contenido (rejilla de accesos) dentro de .card-with-lights: es un
   simple contenedor de la rejilla, no una tarjeta independiente. La regla genérica de arriba
   le daba su propio borde/sombra/radio, que se veía como un borde redondeado suelto justo
   debajo de la cabecera de color. Se quita el borde/sombra y el radio superior (queda pegada
   a la cabecera); se mantiene el radio inferior para que el conjunto siga rematando en punta
   redondeada como el resto de tarjetas. */
.card-with-lights > .card {
    border: none;
    box-shadow: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: var(--avz-radius);
    border-bottom-right-radius: var(--avz-radius);
}
.card-header {
    background: var(--avz-surface);
    border-bottom: 1px solid var(--avz-line);
    border-radius: var(--avz-radius) var(--avz-radius) 0 0 !important;
    font-weight: 800;
    color: var(--avz-ink);
}
.card-footer { background: var(--avz-surface-2); border-top: 1px solid var(--avz-line); }

/* Cabecera de panel SmartAdmin + título de sección de formulario */
.panel-hdr h2,
.panel-title,
.frame-heading {
    font-weight: 800;
    color: var(--avz-ink);
}
.panel-hdr h2 { letter-spacing: -.01em; }

/* ---------------------- ALERTS ---------------------- */
.alert {
    border: none;
    border-radius: var(--avz-radius-md);
    font-weight: 600;
}
.alert-success { background: var(--avz-ok-bg);   color: var(--avz-ok-ink); }
.alert-info    { background: var(--avz-info-bg); color: var(--avz-info-ink); }
.alert-warning { background: var(--avz-warn-bg); color: var(--avz-warn-ink); }
.alert-danger  { background: var(--avz-dang-bg); color: var(--avz-dang-ink); }
.alert-primary { background: var(--avz-brand-soft); color: var(--avz-brand-strong); }

/* ---------------------- LIST GROUP ---------------------- */
.list-group-item { border-color: var(--avz-line); }
.list-group-item.active {
    background: var(--avz-brand-soft);
    border-color: var(--avz-brand-soft);
    color: var(--avz-brand-strong);
}

/* ---------------------- BREADCRUMB ---------------------- */
.breadcrumb { background: transparent; padding: 0; margin: 0; }
.breadcrumb-item { font-weight: 600; color: var(--avz-ink-3); font-size: .92rem; }
.breadcrumb-item.active { color: var(--avz-ink); font-weight: 800; }
.breadcrumb-item a { color: var(--avz-brand-strong); }

/* ---------------------- WIZARDS / PASOS (SmartAdmin) ---------------------- */
.b-steps .step.active .nav-link,
.wizard .nav-link.active,
.nav-steps .active {
    color: var(--avz-brand-strong);
}
.bg-primary,
.badge-primary.bg-primary { background-color: var(--avz-brand) !important; color: var(--avz-on-brand) !important; }
.text-primary,
.color-primary-500 { color: var(--avz-brand-strong) !important; }
.bg-success-600,
.bg-success { background-color: var(--avz-brand) !important; }

/* Gradiente azul de SmartAdmin (cabecera del menú de usuario, etc.) → verde.
   Rango oscuro (strong→deep): encima siempre va texto blanco, que sobre el
   verde claro de marca solo daba 2.15:1. */
.bg-trans-gradient {
    background-image: linear-gradient(250deg, var(--avz-brand-strong), var(--avz-brand-deep)) !important;
}

/* Rebrand de las tonalidades "primary" del tema (azul-gris → verde marca) */
.bg-primary-500 { background-color: var(--avz-brand) !important; }
.bg-primary-600,
.bg-primary-700,
.bg-primary-800,
.bg-primary-900 { background-color: var(--avz-brand-strong) !important; }
.color-primary-300,
.color-primary-500,
.color-primary-600,
.color-primary-700 { color: var(--avz-brand-strong) !important; }

/* Cabeceras "hero" de los dashboards de cliente (laboral/fiscal/contabilidad):
   card-body con gradiente azul del tema → gradiente de marca, texto blanco. */
.card-body.bg-info-gradient,
.bg-primary-700.bg-info-gradient,
.bg-primary-600.bg-info-gradient {
    background-image: linear-gradient(135deg, var(--avz-brand-strong) 0%, var(--avz-brand-deep) 100%) !important;
    color: #fff !important;
}

/* Cabeceras de card con gradiente a medida (indigo/morado hardcodeado, etc.)
   y texto blanco → gradiente de marca. P.ej. .amortizacion-info en Bienes de inversión. */
.card-header.text-white,
.card-header.amortizacion-info,
.card-header.bg-gradient-primary,
.card-header.bg-gradient-info {
    background-image: linear-gradient(135deg, var(--avz-brand-strong) 0%, var(--avz-brand-deep) 100%) !important;
    background-color: var(--avz-brand-strong) !important;
    color: #fff !important;
}
.card-header.text-white *,
.card-header.amortizacion-info * { color: #fff !important; }
.card-header.text-white .badge-light,
.card-header.amortizacion-info .badge-light { background-color: rgba(0,0,0,0.25) !important; color: #fff !important; }

/* ---------------------- HEADER (barra superior) ---------------------- */
.page-header .header-icon:not(.btn) > [class*="fa-"] { color: var(--avz-ink-2); }
.page-header .badge { font-weight: 800; }
.page-header .search .form-control,
#search-field {
    background: var(--avz-input-bg);
    border-radius: var(--avz-radius-sm);
    border: 1px solid transparent;
}

/* Botones outline genéricos */
.btn-outline-primary {
    border-color: var(--avz-brand);
    color: var(--avz-brand-strong);
    background: transparent;
}
.btn-outline-primary:hover {
    background: var(--avz-brand) !important;
    border-color: var(--avz-brand) !important;
    color: var(--avz-on-brand) !important;
}
.btn-info { background: var(--avz-info-bg); border-color: var(--avz-info-bg); color: var(--avz-info-ink); }
.btn-info:hover { filter: brightness(.97); color: var(--avz-info-ink); }
.btn-link { color: var(--avz-brand-strong); font-weight: 700; }

/* =====================================================================
   PARTE 3 · PrimeVue (componentes Vue del proyecto)
   El proyecto carga prime-vue-normalizator.css; aquí alineamos la marca.
   ===================================================================== */
.p-component { font-family: 'Nunito', sans-serif !important; }

/* Botones */
.p-button {
    border-radius: var(--avz-radius-sm);
    font-weight: 700;
    background: var(--avz-brand);
    border-color: var(--avz-brand);
    color: var(--avz-on-brand);
}
.p-button:enabled:hover {
    background: var(--avz-brand-hover);
    border-color: var(--avz-brand-hover);
    color: var(--avz-on-brand);
}
.p-button.p-button-secondary,
.p-button.p-button-outlined {
    background: var(--avz-surface);
    border: 1px solid var(--avz-line-strong);
    color: var(--avz-ink-2);
}
.p-button.p-button-outlined:enabled:hover { background: var(--avz-surface-2); color: var(--avz-ink); }
.p-button.p-button-text { background: transparent; border-color: transparent; color: var(--avz-brand-strong); }
.p-button.p-button-danger { background: var(--avz-dang-bg); border-color: var(--avz-dang-ink); color: var(--avz-dang-ink); }
.p-button.p-button-warning { background: var(--avz-warn-bg); border-color: var(--avz-warn-ink); color: var(--avz-warn-ink); }

/* Inputs */
.p-inputtext,
.p-dropdown,
.p-multiselect,
.p-inputnumber-input,
.p-calendar .p-inputtext,
.p-textarea {
    border-radius: var(--avz-radius-sm);
    border: 1px solid var(--avz-line-strong);
    background: var(--avz-input-bg);
    color: var(--avz-ink);
}
.p-inputtext:enabled:focus,
.p-dropdown:not(.p-disabled).p-focus,
.p-multiselect:not(.p-disabled).p-focus {
    border-color: var(--avz-brand);
    box-shadow: 0 0 0 3px var(--avz-brand-ring);
    background: var(--avz-surface);
}

/* DataTable PrimeVue */
.p-datatable .p-datatable-thead > tr > th {
    background: var(--avz-surface-2);
    color: var(--avz-ink-3);
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .04em;
    border-color: var(--avz-line);
}
.p-datatable .p-datatable-tbody > tr { color: var(--avz-ink-2); }
.p-datatable .p-datatable-tbody > tr > td { border-color: var(--avz-line); }
.p-datatable .p-datatable-tbody > tr:hover { background: var(--avz-row-hover); }
.p-datatable .p-datatable-tbody > tr.p-highlight { background: var(--avz-brand-soft); color: var(--avz-ink); }
.p-sortable-column.p-highlight,
.p-sortable-column .p-sortable-column-icon { color: var(--avz-brand-strong); }

/* Paginator */
.p-paginator .p-paginator-page.p-highlight {
    background: var(--avz-brand);
    color: var(--avz-on-brand);
    border-radius: 9px;
}
.p-paginator .p-paginator-page { border-radius: 9px; }

/* Diálogos */
.p-dialog {
    border-radius: var(--avz-radius);
    box-shadow: var(--avz-shadow-pop);
    overflow: hidden;
    border: none;
}
.p-dialog .p-dialog-header { border-bottom: 1px solid var(--avz-line); font-weight: 800; color: var(--avz-ink); }
.p-dialog .p-dialog-footer { border-top: 1px solid var(--avz-line); }
/* Iconos de cabecera (maximizar/cerrar): el tema los pinta morados → ghost discreto */
.p-dialog .p-dialog-header-icon {
    background: transparent !important;
    color: var(--avz-ink-3) !important;
    border: none !important;
    border-radius: 8px;
    box-shadow: none !important;
}
.p-dialog .p-dialog-header-icon:enabled:hover,
.p-dialog .p-dialog-header-icon:hover,
.p-dialog .p-dialog-header-icon:focus {
    background: var(--avz-surface-2) !important;
    color: var(--avz-ink) !important;
}

/* TabView */
.p-tabview .p-tabview-nav { border-bottom: 1px solid var(--avz-line); }
.p-tabview .p-tabview-nav li .p-tabview-nav-link {
    border: none;
    border-bottom: 2.5px solid transparent;
    color: var(--avz-ink-3);
    font-weight: 700;
    background: transparent;
}
.p-tabview .p-tabview-nav li.p-highlight .p-tabview-nav-link {
    color: var(--avz-brand-strong);
    border-bottom-color: var(--avz-brand);
}

/* Checkbox / radio / switch PrimeVue */
.p-checkbox .p-checkbox-box.p-highlight,
.p-radiobutton .p-radiobutton-box.p-highlight {
    background: var(--avz-brand);
    border-color: var(--avz-brand);
}
.p-inputswitch.p-inputswitch-checked .p-inputswitch-slider { background: var(--avz-brand); }

/* =====================================================================
   PARTE 4 · FullCalendar (dashboard de inicio) y rematres varios
   ===================================================================== */
.fc .fc-button-primary,
.fc-button.fc-button-primary {
    background: var(--avz-surface);
    border: 1px solid var(--avz-line-strong);
    color: var(--avz-ink-2);
    font-weight: 700;
    border-radius: 9px;
    box-shadow: none;
    text-transform: none;
}
.fc .fc-button-primary:not(:disabled):hover,
.fc-button.fc-button-primary:hover {
    background: var(--avz-surface-2);
    border-color: var(--avz-line-strong);
    color: var(--avz-ink);
}
.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active {
    background: var(--avz-brand) !important;
    border-color: var(--avz-brand) !important;
    color: var(--avz-on-brand) !important;
    box-shadow: none !important;
}
.fc .fc-button-group > .fc-button { border-radius: 0; }
.fc .fc-button-group > .fc-button:first-child { border-top-left-radius: 9px; border-bottom-left-radius: 9px; }
.fc .fc-button-group > .fc-button:last-child { border-top-right-radius: 9px; border-bottom-right-radius: 9px; }
.fc .fc-daygrid-day.fc-day-today { background: var(--avz-brand-soft); }
.fc a { color: inherit; }

/* FAB "nuevo" (gradiente azul hardcodeado) → gradiente de marca. Icono en
   tinta on-brand, como btn-primary (el blanco no llega a 3:1 sobre el verde). */
.fab-nuevo,
.btn-floating-fab,
.fab-action {
    background-image: linear-gradient(135deg, var(--avz-brand) 0%, var(--avz-brand-strong) 100%) !important;
    background-color: var(--avz-brand) !important;
    color: var(--avz-on-brand) !important;
    box-shadow: 0 8px 20px rgba(141,192,67,.40) !important;
}

/* Chips / tags */
.p-chip { background: var(--avz-chip-bg); color: var(--avz-chip-ink); border-radius: 999px; }
.p-tag { border-radius: 999px; font-weight: 800; }
.p-tag.p-tag-success { background: var(--avz-ok-bg); color: var(--avz-ok-ink); }
.p-tag.p-tag-info { background: var(--avz-info-bg); color: var(--avz-info-ink); }
.p-tag.p-tag-warning { background: var(--avz-warn-bg); color: var(--avz-warn-ink); }
.p-tag.p-tag-danger { background: var(--avz-dang-bg); color: var(--avz-dang-ink); }

/* Los overrides de modo oscuro están en avanza-reskin-dark.css */

/* ── export-btn tema claro: relleno por defecto, más oscuro en hover, texto negro ── */
.p-button.export-btn.p-button-success { background: rgba(95,154,44,0.35) !important; border-color: #5f9a2c !important; color: #1a3a0a !important; }
.p-button.export-btn.p-button-success:hover { background: rgba(95,154,44,0.55) !important; border-color: #3a6b1a !important; color: #1a3a0a !important; }
.p-button.export-btn.p-button-danger { background: rgba(207,71,63,0.30) !important; border-color: #cf473f !important; color: #5a0d09 !important; }
.p-button.export-btn.p-button-danger:hover { background: rgba(207,71,63,0.52) !important; border-color: #b02d25 !important; color: #5a0d09 !important; }
.p-button.export-btn.p-button-primary { background: rgba(14,165,233,0.25) !important; border-color: #0ea5e9 !important; color: #0c4a6e !important; }
.p-button.export-btn.p-button-primary:hover { background: rgba(14,165,233,0.45) !important; border-color: #0369a1 !important; color: #0c4a6e !important; }

/* ── Bienes de inversión: botones acción tema claro (relleno / texto negro) ── */
.amort-btn-crear { background: rgba(95,154,44,0.35) !important; border-color: #5f9a2c !important; color: #1a3a0a !important; }
.amort-btn-crear:hover { background: rgba(95,154,44,0.10) !important; border-color: #5f9a2c !important; color: #3a6b1a !important; }
.amort-btn-editar { background: rgba(14,165,233,0.25) !important; border-color: #0ea5e9 !important; color: #0c4a6e !important; }
.amort-btn-editar:hover { background: rgba(14,165,233,0.08) !important; border-color: #0ea5e9 !important; color: #0369a1 !important; }
.amort-btn-addline { background: rgba(234,179,8,0.30) !important; border-color: #d97706 !important; color: #451a03 !important; }
.amort-btn-addline:hover { background: rgba(234,179,8,0.10) !important; border-color: #d97706 !important; color: #b45309 !important; }
.amort-btn-exportar { background: rgba(99,102,241,0.25) !important; border-color: #4f46e5 !important; color: #1e1b4b !important; }
.amort-btn-exportar:hover { background: rgba(99,102,241,0.45) !important; border-color: #3730a3 !important; color: #1e1b4b !important; }

/* ── Bienes de inversión: botones Cancelar/Guardar en edición (sobre card-header verde) ── */
.amort-btn-cancel-edit { background: rgba(207,71,63,0.35) !important; border-color: rgba(207,71,63,0.8) !important; color: #3a0000 !important; }
.amort-btn-cancel-edit:hover { background: rgba(207,71,63,0.12) !important; border-color: rgba(207,71,63,0.7) !important; color: #b02d25 !important; }
.amort-btn-save-edit { background: rgba(255,255,255,0.55) !important; border-color: rgba(255,255,255,0.9) !important; color: #000 !important; }
.amort-btn-save-edit:hover { background: rgba(255,255,255,0.25) !important; border-color: rgba(255,255,255,0.6) !important; }

/* ── TabMenu tema claro: fondo blanco + marca verde activo ── */
.p-tabmenu .p-tabmenu-nav { background: #fff !important; border-bottom-color: #dee2e6 !important; }
.p-tabmenu .p-tabmenu-nav .p-tabmenuitem .p-menuitem-link { background: transparent !important; color: #6c757d !important; border-bottom-color: transparent !important; }
.p-tabmenu .p-tabmenu-nav .p-tabmenuitem:not(.p-highlight):not(.p-disabled):hover .p-menuitem-link { background: rgba(95,154,44,0.06) !important; color: #3a6b1a !important; }
.p-tabmenu .p-tabmenu-nav .p-tabmenuitem.p-highlight .p-menuitem-link { background: rgba(95,154,44,0.10) !important; color: #3a6b1a !important; border-bottom-color: #5f9a2c !important; }
.p-tabmenu .p-tabmenu-nav .p-tabmenu-ink-bar { background-color: #5f9a2c !important; }

/* ── Filtros estado amortización (Pendiente/Finalizada/Todas) tema claro ── */
.amort-filter-group .btn-outline-warning  { background: rgba(234,179,8,0.15) !important; border-color: #d97706 !important; color: #92400e !important; }
.amort-filter-group .btn-warning          { background: #d97706 !important; border-color: #b45309 !important; color: #fff !important; box-shadow: 0 2px 6px rgba(217,119,6,0.45) !important; }
.amort-filter-group .btn-outline-warning:hover  { background: rgba(234,179,8,0.28) !important; }
.amort-filter-group .btn-warning:hover          { background: #b45309 !important; }

.amort-filter-group .btn-outline-success  { background: rgba(95,154,44,0.15) !important; border-color: #5f9a2c !important; color: #1a3a0a !important; }
.amort-filter-group .btn-success          { background: #5f9a2c !important; border-color: #3a6b1a !important; color: #fff !important; box-shadow: 0 2px 6px rgba(95,154,44,0.45) !important; }
.amort-filter-group .btn-outline-success:hover  { background: rgba(95,154,44,0.28) !important; }
.amort-filter-group .btn-success:hover          { background: #3a6b1a !important; }

.amort-filter-group .btn-outline-secondary { background: rgba(100,116,139,0.12) !important; border-color: #64748b !important; color: #334155 !important; }
.amort-filter-group .btn-secondary         { background: #475569 !important; border-color: #334155 !important; color: #fff !important; box-shadow: 0 2px 6px rgba(71,85,105,0.45) !important; }
.amort-filter-group .btn-outline-secondary:hover { background: rgba(100,116,139,0.22) !important; }
.amort-filter-group .btn-secondary:hover         { background: #334155 !important; }

/* ── Diario icon buttons tema claro: mismo estilo que export buttons ── */
.p-button.diario-icon-btn { border: 1px solid !important; border-radius: 8px !important; }
.p-button.diario-icon-btn.p-button-success  { background: rgba(95,154,44,0.20) !important; border-color: #5f9a2c !important; color: #1a3a0a !important; }
.p-button.diario-icon-btn.p-button-success:hover  { background: rgba(95,154,44,0.40) !important; border-color: #3a6b1a !important; }
.p-button.diario-icon-btn.p-button-danger   { background: rgba(207,71,63,0.18) !important; border-color: #cf473f !important; color: #5a0d09 !important; }
.p-button.diario-icon-btn.p-button-danger:hover   { background: rgba(207,71,63,0.35) !important; border-color: #b02d25 !important; }
.p-button.diario-icon-btn.p-button-info     { background: rgba(14,165,233,0.18) !important; border-color: #0ea5e9 !important; color: #0c4a6e !important; }
.p-button.diario-icon-btn.p-button-info:hover     { background: rgba(14,165,233,0.35) !important; border-color: #0369a1 !important; }
.p-button.diario-icon-btn.p-button-secondary { background: rgba(100,116,139,0.12) !important; border-color: #64748b !important; color: #334155 !important; }
.p-button.diario-icon-btn.p-button-secondary:hover { background: rgba(100,116,139,0.25) !important; }
.p-button.diario-icon-btn.btn-diagram       { background: rgba(234,179,8,0.18) !important; border-color: #d97706 !important; color: #92400e !important; }
.p-button.diario-icon-btn.btn-diagram:hover { background: rgba(234,179,8,0.35) !important; border-color: #b45309 !important; }

/* ── FormConstructor: botones cancel/guardar ── */
.accordion-clean .panel-container,
.accordion-clean .panel-content,
.accordion-clean .card-body { border-radius: 0 !important; }

/* Botones sobre barra oscura (bg-secondary): texto blanco, fondo semitransparente */
.fc-btn-cancel { background: rgba(207,71,63,0.65) !important; border: 1px solid rgba(207,71,63,0.85) !important; color: #fff !important; font-weight: 600; }
.fc-btn-cancel:hover { background: rgba(207,71,63,0.85) !important; color: #fff !important; }

.fc-btn-save { background: var(--avz-brand-strong) !important; border: 1px solid rgba(95,154,44,0.85) !important; color: #fff !important; font-weight: 600; }
/* Hover oscurece (el verde claro de marca no soporta texto blanco) */
.fc-btn-save:hover { background: var(--avz-brand-deep) !important; border-color: var(--avz-brand-deep) !important; color: #fff !important; }

/* ══════════════════════════════════════════════════════════════════
   Module hubs (billModule, config, laboral, fiscal, etc.)
   ══════════════════════════════════════════════════════════════════ */

/* Panel: borde limpio y sombra suave */
.filter-section .panel {
    border: 1px solid var(--avz-line) !important;
    border-radius: var(--avz-radius-md) !important;
    overflow: hidden !important;
    box-shadow: 0 2px 14px rgba(20,40,25,.07) !important;
}
.filter-section .panel .panel-container { border-radius: 0 !important; }
.filter-section .panel .panel-content { padding: 0 !important; }

/* Section header: tinte verde + tipografía compact */
.filter-section .panel-hdr {
    background: rgba(141, 192, 67, .12) !important;
    border-bottom: 1px solid rgba(141, 192, 67, .28) !important;
    border-radius: var(--avz-radius-md) var(--avz-radius-md) 0 0 !important;
    min-height: 40px;
    padding: 0 14px;
}
.filter-section .panel-hdr h2 {
    font-size: .8rem !important;
    font-weight: 800 !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
    color: var(--avz-brand-strong) !important;
}
.filter-section .panel-hdr h2 span { color: var(--avz-brand-strong) !important; }
.filter-section .panel-hdr [class*="fa-"],
.filter-section .panel-hdr .fal { color: var(--avz-brand-strong) !important; }

/* Nav links: hover suave + icono verde + indent ligero */
.nav-menu.nav-menu-compact li.shadow-2 {
    box-shadow: none !important;
    border-bottom: 1px solid var(--avz-line) !important;
}
.nav-menu.nav-menu-compact li.shadow-2:last-child { border-bottom: none !important; }
.nav-menu.nav-menu-compact li.shadow-2 a {
    padding: 10px 14px !important;
    font-size: .9rem !important;
    font-weight: 500 !important;
    color: var(--avz-ink-2) !important;
    background: transparent !important;
    display: flex;
    align-items: center;
    transition: background .12s, color .12s, padding-left .12s !important;
}
.nav-menu.nav-menu-compact li.shadow-2 a:hover {
    background: var(--avz-brand-soft) !important;
    color: var(--avz-brand-strong) !important;
    padding-left: 20px !important;
    text-decoration: none !important;
}
.nav-menu.nav-menu-compact li.shadow-2 a .nav-link-text i,
.nav-menu.nav-menu-compact li.shadow-2 a > i {
    color: var(--avz-brand) !important;
    font-size: .82rem;
    width: 16px;
    text-align: center;
    transition: color .12s;
}
.nav-menu.nav-menu-compact li.shadow-2 a:hover .nav-link-text i,
.nav-menu.nav-menu-compact li.shadow-2 a:hover > i { color: var(--avz-brand-strong) !important; }

/* Search bar en módulos hub */
.input-group.input-group-lg .form-control.shadow-inset-2 {
    border: 1.5px solid var(--avz-line) !important;
    border-right: none !important;
    border-radius: var(--avz-radius-sm) 0 0 var(--avz-radius-sm) !important;
    background: #fff !important;
    box-shadow: none !important;
    font-size: .95rem !important;
    height: 48px !important;
    color: var(--avz-ink) !important;
    transition: border-color .15s, box-shadow .15s !important;
}
.input-group.input-group-lg .form-control.shadow-inset-2:focus {
    border-color: var(--avz-brand) !important;
    box-shadow: 0 0 0 3px var(--avz-brand-ring) !important;
}
.input-group.input-group-lg .input-group-append .input-group-text {
    border: 1.5px solid var(--avz-line) !important;
    border-left: none !important;
    border-radius: 0 var(--avz-radius-sm) var(--avz-radius-sm) 0 !important;
    background: #fff !important;
    color: var(--avz-ink-3) !important;
}

/* ── PrimeVue Calendar: botón integrado al input ── */
.p-calendar.p-calendar-w-btn .p-inputtext {
    border-right: none !important;
    border-radius: var(--avz-radius-sm) 0 0 var(--avz-radius-sm) !important;
}
.p-calendar .p-datepicker-trigger {
    background: var(--avz-surface-2) !important;
    border: 1px solid var(--avz-line) !important;
    border-left: none !important;
    border-radius: 0 var(--avz-radius-sm) var(--avz-radius-sm) 0 !important;
    color: var(--avz-brand-strong) !important;
    width: 2.6rem !important;
    padding: 0 !important;
    transition: background .15s, border-color .15s !important;
}
.p-calendar .p-datepicker-trigger:enabled:hover {
    background: var(--avz-brand-soft) !important;
    border-color: var(--avz-brand) !important;
    color: var(--avz-brand-strong) !important;
}
.p-calendar.p-calendar-w-btn:focus-within .p-datepicker-trigger {
    border-color: var(--avz-brand) !important;
}

/* ── FlatPickr Presets (Selección rápida) ── */
.flatpickr-presets {
    padding: 0;
    border-bottom: 1px solid #e6e6e6;
    max-height: 200px;
    overflow-y: auto;
    background: #fff;
}
.flatpickr-presets__title {
    font-weight: bold;
    padding: 12px 15px 10px;
    color: #2c3e50;
    font-size: 14px;
    border-bottom: 2px solid #3498db;
    background: linear-gradient(to bottom, #f8f9fa, #ffffff);
    position: sticky;
    top: 0;
    z-index: 10;
}
.flatpickr-presets__year-section {
    margin: 0;
    padding: 12px 15px;
}
.flatpickr-presets__year-section.is-current-year {
    background: linear-gradient(to right, #e8f5e9, #f1f8f4);
    border-left: 4px solid #4caf50;
    border-bottom: 1px solid #c8e6c9;
}
.flatpickr-presets__year-section.is-past-year {
    background: linear-gradient(to right, #f5f5f5, #fafafa);
    border-left: 4px solid #9e9e9e;
    border-bottom: 1px solid #e0e0e0;
}
.flatpickr-presets__year-title {
    font-weight: 600;
    font-size: 14px;
    color: #2e7d32;
    margin-bottom: 10px;
    padding: 6px 10px;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 4px;
    display: inline-block;
    border: 1px solid #81c784;
}
.flatpickr-presets__year-section.is-past-year .flatpickr-presets__year-title {
    color: #616161;
    background: rgba(255, 255, 255, 0.8);
    border-color: #bdbdbd;
}
.flatpickr-presets__buttons {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.flatpickr-presets__btn {
    display: block;
    width: 100%;
    padding: 9px 12px;
    text-align: left;
    border-radius: 5px;
    cursor: pointer;
    font-size: 12px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    border: 1px solid;
    font-weight: 500;
}
/* Botones año actual */
.flatpickr-presets__btn.is-current-year.flatpickr-presets__btn--year {
    background: var(--avz-brand-strong); color: #fff; border-color: var(--avz-brand-deep);
    box-shadow: 0 2px 4px rgba(76,175,80,.3);
}
.flatpickr-presets__btn.is-current-year.flatpickr-presets__btn--semester {
    background: #81c784; color: #1b5e20; border-color: #66bb6a;
}
.flatpickr-presets__btn.is-current-year.flatpickr-presets__btn--quarter {
    background: #a5d6a7; color: #2e7d32; border-color: #81c784;
}
.flatpickr-presets__btn.is-current-year.flatpickr-presets__btn--month {
    background: #c8e6c9; color: #1b5e20; border-color: #a5d6a7;
}
/* Botones años anteriores */
.flatpickr-presets__btn.is-past-year.flatpickr-presets__btn--year {
    background: #757575; color: #fff; border-color: #616161;
    box-shadow: 0 2px 4px rgba(117,117,117,.3);
}
.flatpickr-presets__btn.is-past-year.flatpickr-presets__btn--semester {
    background: #9e9e9e; color: #212121; border-color: #757575;
}
.flatpickr-presets__btn.is-past-year.flatpickr-presets__btn--quarter {
    background: #bdbdbd; color: #424242; border-color: #9e9e9e;
}
.flatpickr-presets__btn.is-past-year.flatpickr-presets__btn--month {
    background: #e0e0e0; color: #424242; border-color: #bdbdbd;
}
.flatpickr-presets__btn:hover {
    transform: translateX(3px);
    box-shadow: 0 3px 6px rgba(0,0,0,.2);
}

/* ── Badge de entorno (LOCAL / TESTING) en topbar ── */
.avz-env-badge {
    display: inline-flex;
    align-items: center;
    background: var(--avz-brand-soft);
    color: var(--avz-brand-strong);
    border: 1px solid rgba(141, 192, 67, .45);
    border-radius: 6px;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
    padding: 3px 9px;
    line-height: 1;
    white-space: nowrap;
}

/* ══════════════════════════════════════════════════════════════════
   Selector de empresa (#modal-shortcut · company-selector.blade.php)
   ══════════════════════════════════════════════════════════════════ */
.avz-company-dialog { max-width: 740px; width: calc(100vw - 24px); }
.avz-company-dialog .modal-body { padding: 16px 20px 20px; }

.avz-company-search { position: relative; margin-bottom: 14px; }
.avz-company-search > i {
    position: absolute;
    left: 13px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--avz-ink-3);
    pointer-events: none;
}
.avz-company-search .form-control { padding-left: 34px; }

.avz-company-grid {
    list-style: none;
    margin: 0;
    padding: 2px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 10px;
    max-height: min(58vh, 520px);
    overflow-y: auto;
}
.avz-company-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    height: 100%;
    padding: 12px 10px;
    border: 1px solid var(--avz-line);
    border-radius: var(--avz-radius-md);
    background: var(--avz-surface);
    text-decoration: none !important;
    transition: background .12s ease, border-color .12s ease;
}
.avz-company-card:hover {
    background: var(--avz-row-hover);
    border-color: var(--avz-line-strong);
}
.avz-company-card.is-active {
    border-color: var(--avz-brand);
    box-shadow: 0 0 0 1px var(--avz-brand);
}
/* Chip del logo: blanco fijo también en oscuro, los logotipos lo necesitan */
.avz-company-logo {
    width: 100%;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid var(--avz-line);
    border-radius: 10px;
    padding: 6px;
}
.avz-company-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.avz-company-initials {
    font-size: 22px;
    font-weight: 800;
    letter-spacing: .03em;
    color: var(--avz-brand-strong);
}
.avz-company-name {
    font-size: .92rem;
    font-weight: 700;
    line-height: 1.3;
    color: var(--avz-ink);
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.avz-company-current {
    position: absolute;
    top: 6px;
    right: 6px;
    background: var(--avz-brand);
    color: var(--avz-on-brand);
    font-size: 10.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
    padding: 2px 8px;
    border-radius: 999px;
}
.avz-company-empty {
    margin: 0;
    padding: 18px 0 6px;
    text-align: center;
    color: var(--avz-ink-2);
}

.avz-company-grid { align-content: start; min-height: 120px; transition: opacity .12s ease; }
.avz-company-grid.is-loading { opacity: .55; pointer-events: none; }
.avz-company-pagination { display: flex; justify-content: center; margin-top: 14px; }
.avz-company-pagination .pagination { margin: 0; }
