/*
 * SIL 2026 - piel «Moderna» (docs/piel-moderna.md).
 *
 * Se carga DESPUÉS de bootstrap.css y app.css y SOLO cuando <html data-piel="moderna">
 * (templates/base.html.twig). Todas las reglas van prefijadas con [data-piel="moderna"], así
 * ganan por especificidad sobre app.css y la piel Clásica no cambia en nada.
 *
 * Lenguaje visual (la variante v12 elegida por el cliente, «noche con líneas, ámbar»; tono Oscuro):
 * fondo oscuro #0B1220, barra lateral y cabeceras #0F172A, paneles planos #111A2B con una barra
 * lateral izquierda ámbar de 5 px y radio 6, títulos y cabeceras de tabla en mayúsculas chicas
 * con espaciado, etiquetas en mayúsculas 11 px gris, campos subrayados (sin bordes laterales,
 * línea inferior de 2 px que pasa a ámbar al foco), botones rectos (radio 4) en mayúsculas,
 * acento único ámbar #F59E0B (siempre con texto oscuro #1C1917 encima), verde / rojo / ámbar
 * solo para estados. Tipografía Inter autoalojada (assets/fonts/inter, OFL), 15 px.
 * Tres TONOS (<html data-tono>, elegidos en el menú del usuario en lugar de «Modo oscuro»):
 * Oscuro (la v12, por defecto), Medio (gris azulado) y Claro (superficies claras, barras oscuras).
 * Solo cambian las variables --t-* de la Paleta; ninguna regla usa colores fijos de superficie o
 * texto. Regla de oro: NUNCA un texto que se pierda en el fondo (>= 4,5:1, WCAG AA), verificado con
 * tools/capturas/capturas_final.js (docs/piel-moderna.md).
 */

/* ---------- Inter autoalojada (latin + latin-ext, 400/500/600/700) ---------- */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/inter/inter-latin-ext-400-normal-Gaz771Z.woff2") format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/inter/inter-latin-400-normal-Nq2MFc6.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/inter/inter-latin-ext-500-normal-bB2t_xf.woff2") format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/inter/inter-latin-500-normal-G_crC3O.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/inter/inter-latin-ext-600-normal-_ZxP1XP.woff2") format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/inter/inter-latin-600-normal-5rtOGK2.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/inter/inter-latin-ext-700-normal-4drdncn.woff2") format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/inter/inter-latin-700-normal-sxlLprI.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Paleta: tres tonos con las mismas variables ----------
 * El tono sale en <html data-tono="claro|medio|oscuro"> (cookie sil_tono, POST /tono/{nombre}).
 * Todo el archivo dibuja superficies, bordes y textos con las variables --t-* (las del tono);
 * las --mod-* son lo común a los tres (el acento y los estados como relleno, las medidas).
 * Oscuro (la v12) es la base; Medio y Claro pisan SOLO las --t-* y los --bs-*-rgb (Bootstrap los
 * necesita en números). Para un componente nuevo: usar siempre estas variables (docs/piel-moderna.md).
 */
[data-piel="moderna"],
[data-piel="moderna"][data-bs-theme="light"],
[data-piel="moderna"][data-bs-theme="dark"] {
    color-scheme: dark; /* calendario, flechas de número, listas nativas y scrollbars en oscuro */

    /* --- Común a los tres tonos --- */
    --mod-acento: #F59E0B;          /* RELLENO: botones principales, barras de los paneles, subrayado activo */
    --mod-acento-hover: #FBBF24;
    --mod-acento-activo: #D97706;
    --mod-acento-texto: #1C1917;    /* texto SOBRE ámbar, siempre (8,6:1) */
    --mod-halo: rgba(245, 158, 11, .35);
    --mod-verde: #22C55E;           /* líneas y bordes verdes */
    --mod-verde-fondo: #15803D;     /* botones verdes con texto blanco (5:1) */
    --mod-verde-fondo-hover: #166534;
    --mod-verde-fondo-activo: #14532D;
    --mod-rojo: #EF4444;
    --mod-rojo-fondo: #DC2626;      /* botones rojos con texto blanco (4,8:1) */
    --mod-rojo-fondo-hover: #B91C1C;
    --mod-rojo-fondo-activo: #991B1B;
    --mod-radio: 4px;
    --mod-radio-grande: 6px;
    --barra-ancho: 240px;
    --barra-mini: 64px;
    --barra-alto: 60px;

    /* --- Tono Oscuro (v12, por defecto) --- */
    --t-fondo: #0B1220;             /* fondo de la página */
    --t-panel: #111A2B;             /* paneles, modales, menús */
    --t-cabecera: #0F172A;          /* cabeceras de panel, de tabla y de modal, pies */
    --t-cabecera-hover: #16213A;
    --t-elevado: #1E293B;           /* chips neutros, botones de ícono neutros, botón de archivo */
    --t-borde: #1E293B;
    --t-borde-fuerte: #334155;
    --t-borde-foco: #475569;
    --t-texto: #E2E8F0;
    --t-texto-fuerte: #F8FAFC;
    --t-texto-campo: #F8FAFC;       /* valor tipeado en los campos: el más claro */
    --t-texto-2: #CBD5E1;
    --t-texto-3: #94A3B8;           /* secundario: etiquetas, ayudas */
    --t-texto-apagado: #8392A8;     /* deshabilitados, rótulos de menú (>= 4,5:1 sobre panel) */
    --t-placeholder: #6B7A90;
    --t-campo: #0B1220;
    --t-campo-foco: #0F172A;
    --t-campo-linea: #334155;
    --t-hover: rgba(245, 158, 11, .08);
    --t-zebra: rgba(255, 255, 255, .02);
    --t-cabecera-texto: #CBD5E1;
    --t-barra: #0F172A;             /* barra lateral y barra superior */
    --t-barra-franja: #0B1220;      /* logo, tarjeta del usuario, submenús, pie de la barra */
    --t-barra-hover: #1A2438;
    --t-barra-activo: #0B1220;
    --t-barra-borde: #1E293B;
    --t-barra-texto: #CBD5E1;
    --t-barra-texto-fuerte: #F8FAFC;
    --t-barra-rotulo: #94A3B8;
    --t-acento-fg: #F59E0B;         /* ámbar COMO TEXTO o ícono sobre las superficies del tono */
    --t-acento-fg-hover: #FBBF24;
    --t-acento-claro: #FCD34D;      /* texto sobre los tintes ámbar (etiquetas, chips, pestañas) */
    --t-acento-suave: rgba(245, 158, 11, .12);
    --t-acento-suave-2: rgba(245, 158, 11, .22);
    --t-acento-borde: rgba(245, 158, 11, .45);
    --t-verde-texto: #86EFAC;
    --t-verde-suave: rgba(34, 197, 94, .14);
    --t-verde-borde: rgba(34, 197, 94, .45);
    --t-rojo-texto: #FCA5A5;
    --t-rojo-suave: rgba(239, 68, 68, .14);
    --t-rojo-borde: rgba(239, 68, 68, .5);
    --t-vencida-fondo: rgba(220, 38, 38, .2);
    --t-vencida-hover: rgba(220, 38, 38, .3);
    --t-vencida-texto: #FECACA;
    --t-urgente-fondo: rgba(245, 158, 11, .14);
    --t-neutro-fondo: #475569;      /* semáforo gris, .bg-secondary-subtle */
    --t-tooltip-fondo: #334155;
    --t-tooltip-texto: #F8FAFC;
    --t-seleccion: rgba(245, 158, 11, .4);
    --t-seleccion-texto: #FFFFFF;
    --t-sombra: 0 12px 32px rgba(0, 0, 0, .55);
    --t-sombra-modal: 0 24px 64px rgba(0, 0, 0, .6);
    --t-sombra-pagina: 0 2px 12px rgba(0, 0, 0, .6);
    --t-backdrop: #020617;
    --t-backdrop-opacidad: .75;
    --t-btn-close-filtro: invert(1) grayscale(100%) brightness(200%);
    --t-flecha: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2394A3B8' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    --t-switch: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2394A3B8'/%3e%3c/svg%3e");
    --t-visor-fondo: #0B1220;
    --t-login-fondo: radial-gradient(ellipse at 20% 0%, rgba(245, 158, 11, .08) 0%, transparent 45%), linear-gradient(160deg, #1E293B 0%, #0F172A 40%, #0B1220 75%, #050811 100%);
    --t-login-sombra: 0 24px 64px rgba(0, 0, 0, .55);
    /* Gráficos (Chart.js los lee con getComputedStyle: window.SIL_PIEL en assets/app.js) */
    --t-grafico-texto: #CBD5E1;
    --t-grafico-grilla: rgba(148, 163, 184, .18);
    --t-grafico-borde: #111A2B;
    --t-serie-1: #F59E0B;
    --t-serie-2: #22D3EE;
    --t-serie-3: #A78BFA;
    --t-serie-4: #4ADE80;
    --t-serie-5: #F87171;
    --t-serie-6: #60A5FA;
    --t-serie-7: #F472B6;
    --t-serie-8: #A3E635;
    --t-estado-tramite: #F59E0B;
    --t-estado-aprobado: #22C55E;
    --t-estado-rechazado: #EF4444;

    /* Las variables de app.css: lo que app.css ya dibuja con ellas se adapta solo */
    --sil-azul: var(--t-barra);
    --sil-azul-oscuro: var(--t-barra-franja);
    --sil-primario: var(--t-acento-fg);
    --sil-verde: var(--mod-verde);
    --sil-verde-oscuro: var(--mod-verde-fondo);
    --sil-fondo: var(--t-fondo);
    --sil-panel: var(--t-panel);
    --sil-borde: var(--t-borde);
    --sil-gris: var(--t-cabecera);
    --sil-texto: var(--t-texto);
    --sil-texto-fuerte: var(--t-texto-fuerte);
    --sil-limpiar: var(--t-texto-3);

    /* Bootstrap 5.3: colores y tipografía base (pisan tanto el tema claro como el oscuro) */
    --bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --bs-body-font-size: 15px;
    --bs-body-line-height: 1.5;
    --bs-body-color: var(--t-texto);
    --bs-body-bg: var(--t-fondo);
    --bs-emphasis-color: var(--t-texto-fuerte);
    --bs-secondary-color: var(--t-texto-3);
    --bs-secondary-bg: var(--t-cabecera);
    --bs-tertiary-color: var(--t-texto-apagado);
    --bs-tertiary-bg: var(--t-cabecera);
    --bs-heading-color: var(--t-texto-fuerte);
    --bs-border-color: var(--t-borde);
    --bs-border-color-translucent: var(--t-borde);
    --bs-border-radius: 4px;
    --bs-border-radius-sm: 3px;
    --bs-border-radius-lg: 6px;
    --bs-border-radius-xl: 6px;
    --bs-border-radius-pill: 4px;
    --bs-link-color: var(--t-acento-fg);
    --bs-link-hover-color: var(--t-acento-fg-hover);
    --bs-code-color: var(--t-acento-claro);
    --bs-highlight-bg: var(--t-seleccion);
    --bs-highlight-color: var(--t-texto-fuerte);
    --bs-primary: #F59E0B;
    --bs-primary-rgb: 245, 158, 11;
    --bs-primary-text-emphasis: var(--t-acento-claro);
    --bs-primary-bg-subtle: var(--t-acento-suave);
    --bs-primary-border-subtle: var(--t-acento-borde);
    --bs-secondary-text-emphasis: var(--t-texto-2);
    --bs-secondary-bg-subtle: var(--t-elevado);
    --bs-secondary-border-subtle: var(--t-borde-fuerte);
    --bs-success: #22C55E;
    --bs-success-rgb: 34, 197, 94;
    --bs-success-text-emphasis: var(--t-verde-texto);
    --bs-success-bg-subtle: var(--t-verde-suave);
    --bs-success-border-subtle: var(--t-verde-borde);
    --bs-danger: #EF4444;
    --bs-danger-rgb: 239, 68, 68;
    --bs-danger-text-emphasis: var(--t-rojo-texto);
    --bs-danger-bg-subtle: var(--t-rojo-suave);
    --bs-danger-border-subtle: var(--t-rojo-borde);
    --bs-warning: #F59E0B;
    --bs-warning-rgb: 245, 158, 11;
    --bs-warning-text-emphasis: var(--t-acento-claro);
    --bs-warning-bg-subtle: var(--t-acento-suave);
    --bs-warning-border-subtle: var(--t-acento-borde);
    --bs-info: #F59E0B;
    --bs-info-rgb: 245, 158, 11;
    --bs-info-text-emphasis: var(--t-acento-claro);
    --bs-info-bg-subtle: var(--t-acento-suave);
    --bs-info-border-subtle: var(--t-acento-borde);
    --bs-light: var(--t-elevado);
    --bs-light-text-emphasis: var(--t-texto);
    --bs-light-bg-subtle: var(--t-elevado);
    --bs-light-border-subtle: var(--t-borde-fuerte);
    --bs-dark: var(--t-fondo);
    --bs-dark-text-emphasis: var(--t-texto);
    --bs-dark-bg-subtle: var(--t-cabecera);
    --bs-dark-border-subtle: var(--t-borde-fuerte);
    --bs-focus-ring-color: var(--mod-halo);
    --bs-form-invalid-color: var(--t-rojo-texto);
    --bs-form-invalid-border-color: var(--mod-rojo);
    --bs-form-valid-color: var(--t-verde-texto);
    --bs-form-valid-border-color: var(--mod-verde);
    --bs-form-control-bg: var(--t-campo);
    --bs-form-control-disabled-bg: var(--t-cabecera);
    /* los mismos en números (Bootstrap arma rgba() con ellos) */
    --bs-body-color-rgb: 226, 232, 240;
    --bs-body-bg-rgb: 11, 18, 32;
    --bs-emphasis-color-rgb: 248, 250, 252;
    --bs-secondary-color-rgb: 148, 163, 184;
    --bs-secondary-bg-rgb: 15, 23, 42;
    --bs-tertiary-color-rgb: 131, 146, 168;
    --bs-tertiary-bg-rgb: 15, 23, 42;
    --bs-link-color-rgb: 245, 158, 11;
    --bs-link-hover-color-rgb: 251, 191, 36;
    --bs-light-rgb: 30, 41, 59;
    --bs-dark-rgb: 11, 18, 32;
}

/* --- Tono Medio: gris azulado intermedio (la misma lógica, superficies más claras) --- */
[data-piel="moderna"][data-tono="medio"] {
    color-scheme: dark;
    --t-fondo: #1E293B;
    --t-panel: #263447;
    --t-cabecera: #1B2738;
    --t-cabecera-hover: #2E3D52;
    --t-elevado: #33445C;
    --t-borde: #3B4A61;
    --t-borde-fuerte: #4B5B74;
    --t-borde-foco: #64748B;
    --t-texto: #E2E8F0;
    --t-texto-fuerte: #F8FAFC;
    --t-texto-campo: #F8FAFC;
    --t-texto-2: #CBD5E1;
    --t-texto-3: #A8B4C6;
    --t-texto-apagado: #9AA7BA;
    --t-placeholder: #7D8BA0;
    --t-campo: #16202F;
    --t-campo-foco: #131C2A;
    --t-campo-linea: #4B5B74;
    --t-hover: rgba(245, 158, 11, .09);
    --t-zebra: rgba(255, 255, 255, .025);
    --t-cabecera-texto: #CBD5E1;
    --t-barra: #16202F;
    --t-barra-franja: #111A27;
    --t-barra-hover: #22304A;
    --t-barra-activo: #111A27;
    --t-barra-borde: #2A3850;
    --t-barra-texto: #CBD5E1;
    --t-barra-texto-fuerte: #F8FAFC;
    --t-barra-rotulo: #9AA7BA;
    --t-acento-fg: #FBBF24;
    --t-acento-fg-hover: #FCD34D;
    --t-acento-claro: #FCD34D;
    --t-neutro-fondo: #5B6B82;
    --t-tooltip-fondo: #0F172A;
    --t-tooltip-texto: #F8FAFC;
    --t-flecha: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23A8B4C6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    --t-switch: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23A8B4C6'/%3e%3c/svg%3e");
    --t-visor-fondo: #16202F;
    --t-login-fondo: radial-gradient(ellipse at 20% 0%, rgba(245, 158, 11, .1) 0%, transparent 45%), linear-gradient(160deg, #334155 0%, #1E293B 40%, #16202F 75%, #0B1220 100%);
    --t-grafico-texto: #CBD5E1;
    --t-grafico-grilla: rgba(203, 213, 225, .16);
    --t-grafico-borde: #263447;
    --bs-body-color-rgb: 226, 232, 240;
    --bs-body-bg-rgb: 30, 41, 59;
    --bs-emphasis-color-rgb: 248, 250, 252;
    --bs-secondary-color-rgb: 168, 180, 198;
    --bs-secondary-bg-rgb: 27, 39, 56;
    --bs-tertiary-color-rgb: 154, 167, 186;
    --bs-tertiary-bg-rgb: 27, 39, 56;
    --bs-link-color-rgb: 251, 191, 36;
    --bs-link-hover-color-rgb: 252, 211, 77;
    --bs-light-rgb: 51, 68, 92;
    --bs-dark-rgb: 30, 41, 59;
}

/* --- Tono Claro: superficies claras; barra lateral y barra superior oscuras para que el ámbar
 *     luzca. El ámbar sigue siendo el relleno de los botones (con texto oscuro); como TEXTO sobre
 *     blanco pasa a #B45309 (5:1) y sobre los tintes ámbar a #92400E. --- */
[data-piel="moderna"][data-tono="claro"] {
    color-scheme: light;
    --t-fondo: #F4F6F9;
    --t-panel: #FFFFFF;
    --t-cabecera: #F1F3F6;
    --t-cabecera-hover: #E5E7EB;
    --t-elevado: #E5E7EB;
    --t-borde: #D1D5DB;
    --t-borde-fuerte: #9CA3AF;
    --t-borde-foco: #6B7280;
    --t-texto: #1F2937;
    --t-texto-fuerte: #111827;
    --t-texto-campo: #111827;
    --t-texto-2: #374151;
    --t-texto-3: #4B5563;
    --t-texto-apagado: #5F6774;
    --t-placeholder: #6B7280;
    --t-campo: #FFFFFF;
    --t-campo-foco: #FFFDF5;
    --t-campo-linea: #9CA3AF;
    --t-hover: rgba(245, 158, 11, .1);
    --t-zebra: rgba(17, 24, 39, .025);
    --t-cabecera-texto: #374151;
    --t-barra: #1F2937;
    --t-barra-franja: #111827;
    --t-barra-hover: #2D3A4D;
    --t-barra-activo: #111827;
    --t-barra-borde: #374151;
    --t-barra-texto: #E5E7EB;
    --t-barra-texto-fuerte: #FFFFFF;
    --t-barra-rotulo: #9CA3AF;
    --t-acento-fg: #B45309;
    --t-acento-fg-hover: #92400E;
    --t-acento-claro: #92400E;
    --t-acento-suave: rgba(245, 158, 11, .14);
    --t-acento-suave-2: rgba(245, 158, 11, .26);
    --t-acento-borde: rgba(217, 119, 6, .55);
    --t-verde-texto: #166534;
    --t-verde-suave: rgba(34, 197, 94, .14);
    --t-verde-borde: rgba(22, 163, 74, .5);
    --t-rojo-texto: #B91C1C;
    --t-rojo-suave: rgba(239, 68, 68, .12);
    --t-rojo-borde: rgba(220, 38, 38, .45);
    --t-vencida-fondo: rgba(220, 38, 38, .12);
    --t-vencida-hover: rgba(220, 38, 38, .2);
    --t-vencida-texto: #7F1D1D;
    --t-urgente-fondo: rgba(245, 158, 11, .18);
    --t-neutro-fondo: #9CA3AF;
    --t-tooltip-fondo: #1F2937;
    --t-tooltip-texto: #F9FAFB;
    --t-seleccion: rgba(245, 158, 11, .35);
    --t-seleccion-texto: #111827;
    --t-sombra: 0 12px 32px rgba(17, 24, 39, .16);
    --t-sombra-modal: 0 24px 64px rgba(17, 24, 39, .28);
    --t-sombra-pagina: 0 1px 6px rgba(17, 24, 39, .25);
    --t-backdrop: #0F172A;
    --t-backdrop-opacidad: .55;
    --t-btn-close-filtro: none;
    --t-flecha: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%234B5563' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    --t-switch: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%236B7280'/%3e%3c/svg%3e");
    --t-visor-fondo: #D1D5DB;
    --t-login-fondo: radial-gradient(ellipse at 20% 0%, rgba(245, 158, 11, .12) 0%, transparent 45%), linear-gradient(160deg, #1E3A5F 0%, #0F2A4A 45%, #0B1220 100%);
    --t-login-sombra: 0 24px 64px rgba(0, 0, 0, .45);
    --t-grafico-texto: #374151;
    --t-grafico-grilla: rgba(17, 24, 39, .1);
    --t-grafico-borde: #FFFFFF;
    --t-serie-1: #D97706;
    --t-serie-2: #0891B2;
    --t-serie-3: #7C3AED;
    --t-serie-4: #16A34A;
    --t-serie-5: #DC2626;
    --t-serie-6: #2563EB;
    --t-serie-7: #DB2777;
    --t-serie-8: #65A30D;
    --t-estado-tramite: #D97706;
    --t-estado-aprobado: #16A34A;
    --t-estado-rechazado: #DC2626;
    --bs-body-color-rgb: 31, 41, 55;
    --bs-body-bg-rgb: 244, 246, 249;
    --bs-emphasis-color-rgb: 17, 24, 39;
    --bs-secondary-color-rgb: 75, 85, 99;
    --bs-secondary-bg-rgb: 241, 243, 246;
    --bs-tertiary-color-rgb: 95, 103, 116;
    --bs-tertiary-bg-rgb: 241, 243, 246;
    --bs-link-color-rgb: 180, 83, 9;
    --bs-link-hover-color-rgb: 146, 64, 14;
    --bs-light-rgb: 229, 231, 235;
    --bs-dark-rgb: 31, 41, 55;
}

/* Muestras del selector de tono (menú del usuario): el color de fondo de cada tono, con borde */
[data-piel="moderna"] .muestra-tono { display: inline-block; width: 14px; height: 14px; border-radius: 3px; border: 1px solid var(--t-borde-foco); flex: 0 0 auto; }
[data-piel="moderna"] .muestra-tono-claro { background: #F4F6F9; }
[data-piel="moderna"] .muestra-tono-medio { background: #1E293B; }
[data-piel="moderna"] .muestra-tono-oscuro { background: #0B1220; }
[data-piel="moderna"] .form-tono .dropdown-item.active { font-weight: 600; }

/* ---------- Base ---------- */
[data-piel="moderna"] body {
    font-family: var(--bs-body-font-family);
    font-size: 15px;
    line-height: 1.5;
    color: var(--t-texto);
    background: var(--t-fondo);
    -webkit-font-smoothing: antialiased;
    scrollbar-color: var(--t-borde-fuerte) var(--t-fondo);
}
[data-piel="moderna"] * { scrollbar-color: var(--t-borde-fuerte) var(--t-fondo); scrollbar-width: thin; }
[data-piel="moderna"] ::-webkit-scrollbar { width: 10px; height: 10px; }
[data-piel="moderna"] ::-webkit-scrollbar-track { background: var(--t-fondo); }
[data-piel="moderna"] ::-webkit-scrollbar-thumb { background: var(--t-borde-fuerte); border-radius: 5px; border: 2px solid var(--t-fondo); }
[data-piel="moderna"] ::-webkit-scrollbar-thumb:hover { background: var(--t-borde-foco); }
[data-piel="moderna"] ::selection { background: var(--t-seleccion); color: var(--t-seleccion-texto); }
[data-piel="moderna"] h1, [data-piel="moderna"] h2, [data-piel="moderna"] h3,
[data-piel="moderna"] h4, [data-piel="moderna"] h5, [data-piel="moderna"] h6 {
    font-weight: 600;
    line-height: 1.3;
    color: var(--t-texto-fuerte);
}
[data-piel="moderna"] h5 { font-size: 15px; text-transform: uppercase; letter-spacing: .06em; }
[data-piel="moderna"] a { color: var(--t-acento-fg); }
[data-piel="moderna"] a:hover { color: var(--t-acento-fg-hover); }
[data-piel="moderna"] ::placeholder { color: var(--t-placeholder) !important; opacity: 1; }
[data-piel="moderna"] hr { border-color: var(--t-borde); opacity: 1; }
[data-piel="moderna"] code { color: var(--t-acento-claro); background: var(--t-fondo); padding: 1px 5px; border-radius: 3px; font-size: .9em; }
[data-piel="moderna"] pre { color: var(--t-texto-2); font-size: 12px; }
[data-piel="moderna"] details summary { color: var(--t-acento-fg); cursor: pointer; }
[data-piel="moderna"] mark { background: var(--mod-acento); color: var(--mod-acento-texto); padding: 0 2px; }
[data-piel="moderna"] strong, [data-piel="moderna"] b { color: var(--t-texto-fuerte); }
[data-piel="moderna"] .text-body-secondary, [data-piel="moderna"] .text-muted, [data-piel="moderna"] .text-secondary { color: var(--t-texto-3) !important; }
[data-piel="moderna"] .text-success { color: var(--t-verde-texto) !important; }
[data-piel="moderna"] .text-danger { color: var(--t-rojo-texto) !important; }
[data-piel="moderna"] .text-warning { color: var(--t-acento-claro) !important; }
[data-piel="moderna"] .text-primary { color: var(--t-acento-fg) !important; }
[data-piel="moderna"] .text-dark { color: var(--t-texto) !important; }
[data-piel="moderna"] .bg-light, [data-piel="moderna"] .bg-white { background-color: var(--t-panel) !important; }
[data-piel="moderna"] .bg-secondary-subtle { background-color: var(--t-neutro-fondo) !important; }
[data-piel="moderna"] .border { border-color: var(--t-borde) !important; }
[data-piel="moderna"] .rounded { border-radius: var(--mod-radio-grande) !important; }
[data-piel="moderna"] .spinner-border.text-secondary { color: var(--t-texto-3) !important; }
[data-piel="moderna"] :focus-visible { outline: 2px solid var(--t-acento-fg); outline-offset: 2px; }
[data-piel="moderna"] .form-control:focus-visible, [data-piel="moderna"] .form-select:focus-visible, [data-piel="moderna"] .ts-control input:focus-visible { outline: 0; }

/* Etiquetas de estado: tinte oscuro + texto claro del color (vigente verde, derogada rojo, pendiente ámbar) */
[data-piel="moderna"] .badge { border-radius: var(--mod-radio); font-weight: 600; font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; padding: .35em .6em; }
[data-piel="moderna"] .badge.rounded-pill { border-radius: 999px !important; text-transform: none; letter-spacing: 0; font-size: 11px; }
[data-piel="moderna"] .text-bg-light, [data-piel="moderna"] .text-bg-secondary { background: var(--t-elevado) !important; color: var(--t-texto-2) !important; border: 1px solid var(--t-borde-fuerte); }
[data-piel="moderna"] .text-bg-success { background: var(--t-verde-suave) !important; color: var(--t-verde-texto) !important; border: 1px solid var(--t-verde-borde); }
[data-piel="moderna"] .text-bg-danger { background: var(--t-rojo-suave) !important; color: var(--t-rojo-texto) !important; border: 1px solid var(--t-rojo-borde); }
[data-piel="moderna"] .text-bg-warning { background: var(--t-acento-suave) !important; color: var(--t-acento-claro) !important; border: 1px solid var(--t-acento-borde); }
[data-piel="moderna"] .text-bg-info, [data-piel="moderna"] .text-bg-primary { background: var(--t-acento-suave) !important; color: var(--t-acento-claro) !important; border: 1px solid var(--t-acento-borde); }
[data-piel="moderna"] .text-bg-dark { background: var(--t-fondo) !important; color: var(--t-texto) !important; border: 1px solid var(--t-borde-fuerte); }
/* El contador de vencimientos del menú: sólido para que se vea desde lejos */
[data-piel="moderna"] #contador-vencimientos.text-bg-danger { background: var(--mod-rojo-fondo) !important; color: #FFFFFF !important; border: 0; }
[data-piel="moderna"] #contador-vencimientos.text-bg-secondary { background: var(--t-barra-borde) !important; color: var(--t-barra-texto-fuerte) !important; border: 0; }

[data-piel="moderna"] .tooltip {
    --bs-tooltip-bg: var(--t-tooltip-fondo);
    --bs-tooltip-color: var(--t-tooltip-texto);
    --bs-tooltip-border-radius: 4px;
    --bs-tooltip-font-size: 12px;
    --bs-tooltip-padding-x: 10px;
    --bs-tooltip-padding-y: 6px;
    --bs-tooltip-opacity: 1;
    font-family: var(--bs-body-font-family);
}
[data-piel="moderna"] .breadcrumb {
    --bs-breadcrumb-divider-color: var(--t-texto-apagado);
    --bs-breadcrumb-item-active-color: var(--t-texto);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 600;
}
[data-piel="moderna"] .btn-close { filter: var(--t-btn-close-filtro); opacity: .7; }
[data-piel="moderna"] .btn-close:hover { opacity: 1; }

/* ---------- Barra lateral (240 px, --t-barra: oscura en los tres tonos, línea ámbar bajo el logo) ---------- */
[data-piel="moderna"] .left_col {
    background: var(--t-barra);
    color: var(--t-barra-texto);
    border-right: 1px solid var(--t-barra-borde);
    box-shadow: none;
}
[data-piel="moderna"] .nav_title {
    background: var(--t-barra-franja);
    border-bottom: 3px solid var(--mod-acento);
}
[data-piel="moderna"] .logo-principal { height: 42px; border-radius: 50%; }
[data-piel="moderna"] .profile { margin: 12px 12px 4px; border: 0; }
[data-piel="moderna"] .profile-box {
    margin: 0;
    padding: 10px 12px;
    gap: 10px;
    border: 0;
    border-left: 3px solid var(--mod-acento);
    border-radius: 0 var(--mod-radio-grande) var(--mod-radio-grande) 0;
    background: var(--t-barra-franja);
    color: var(--t-barra-texto-fuerte);
    font-family: inherit;
}
[data-piel="moderna"] .profile_info { min-width: 0; }
[data-piel="moderna"] .nombre-usuario { font-size: 14px; font-weight: 600; color: var(--t-barra-texto-fuerte); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
[data-piel="moderna"] .oficina-usuario { font-size: 11px; color: var(--t-barra-rotulo); opacity: 1; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Avatar de iniciales (barra lateral y barra superior): ámbar con texto oscuro */
[data-piel="moderna"] .avatar-iniciales {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--mod-acento);
    color: var(--mod-acento-texto);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .02em;
    line-height: 1;
    user-select: none;
}
[data-piel="moderna"] .avatar-iniciales.avatar-chico { width: 32px; height: 32px; font-size: 12px; }
/* Sin usuario (invitado): silueta en vez de iniciales */
[data-piel="moderna"] .avatar-iniciales:empty, [data-piel="moderna"] .usuario-menu .avatar-iniciales:empty { background: var(--t-barra-hover); color: var(--t-barra-texto); box-shadow: inset 0 0 0 1px var(--t-barra-borde); }
[data-piel="moderna"] .avatar-iniciales:empty::before { font-family: 'bootstrap-icons'; content: "\f4e1"; font-size: 18px; } /* bi-person */

[data-piel="moderna"] .main_menu { font-family: inherit; padding: 6px 0 12px; }
[data-piel="moderna"] .menu_section h3 {
    margin: 18px 20px 6px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--t-barra-rotulo);
    text-shadow: none;
}
[data-piel="moderna"] .side-menu li a {
    margin: 0;
    padding: 10px 16px 10px 17px;
    gap: 12px;
    border-right: 0;
    border-left: 3px solid transparent;
    border-radius: 0;
    color: var(--t-barra-texto);
    font-size: 14px;
    font-weight: 500;
    transition: background-color .15s ease, color .15s ease;
}
[data-piel="moderna"] .side-menu li a:hover { background: var(--t-barra-hover); color: var(--t-barra-texto-fuerte); }
[data-piel="moderna"] .side-menu li.current-page > a { background: var(--t-barra-activo); border-left-color: var(--mod-acento); color: var(--t-barra-texto-fuerte); font-weight: 600; }
[data-piel="moderna"] .side-menu li a .bi:first-child { font-size: 17px; width: 22px; color: var(--mod-acento); opacity: 1; }
[data-piel="moderna"] .side-menu li a .chevron { font-size: 11px; color: var(--t-barra-rotulo); }
[data-piel="moderna"] .side-menu li a.deshabilitado { opacity: .5; }
[data-piel="moderna"] .side-menu .child_menu { padding: 2px 0 6px; background: var(--t-barra-franja); }
[data-piel="moderna"] .side-menu .child_menu li a { margin: 0; padding: 7px 16px 7px 52px; font-size: 13px; font-weight: 400; border-left: 3px solid transparent; color: var(--t-barra-texto); }
[data-piel="moderna"] .side-menu .child_menu li a:hover { background: var(--t-barra-hover); }
[data-piel="moderna"] .side-menu .child_menu li.current-page > a { color: var(--mod-acento); background: transparent; border-left-color: var(--mod-acento); font-weight: 600; }
[data-piel="moderna"] .sidebar-footer { background: var(--t-barra-franja); border-top: 1px solid var(--t-barra-borde); padding: 8px 12px; }
[data-piel="moderna"] .sidebar-footer a { color: var(--mod-acento); font-size: 18px; border-radius: var(--mod-radio); padding: 4px 10px; }
[data-piel="moderna"] .sidebar-footer a:hover { color: var(--mod-acento-hover); background: var(--t-barra-hover); }

/* Barra colapsada (64 px, solo íconos) */
[data-piel="moderna"] body.nav-sm .logo-principal { height: 34px; }
[data-piel="moderna"] body.nav-sm .side-menu li a { justify-content: center; margin: 0; padding: 12px 0; border-left: 0; }
[data-piel="moderna"] body.nav-sm .side-menu li.current-page > a { box-shadow: inset 3px 0 0 var(--mod-acento); }
[data-piel="moderna"] body.nav-sm .side-menu li a .bi:first-child { width: auto; font-size: 20px; }
[data-piel="moderna"] body.nav-sm .side-menu li a .badge { display: none; }
[data-piel="moderna"] body.nav-sm .sidebar-footer { justify-content: center; }

/* ---------- Barra superior (--t-barra, 60 px, línea inferior) ---------- */
[data-piel="moderna"] .nav_menu {
    height: var(--barra-alto);
    padding: 0 20px;
    gap: 12px;
    background: var(--t-barra);
    border-bottom: 2px solid var(--t-barra-borde);
}
[data-piel="moderna"] #menu_toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: var(--mod-radio);
    font-size: 24px;
    color: var(--t-barra-rotulo);
    transition: background-color .15s ease, color .15s ease;
}
[data-piel="moderna"] #menu_toggle:hover { background: var(--t-barra-hover); color: var(--mod-acento); }
[data-piel="moderna"] .titulo_principal, [data-piel="moderna"] .titulo_principal_abre {
    font-family: inherit;
    font-size: clamp(13px, 1.4vw, 17px);
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--t-barra-texto);
}
[data-piel="moderna"] .titulo_principal_abre { font-size: 17px; }
[data-piel="moderna"] .navbar-right { gap: 8px; margin-right: 0; }
[data-piel="moderna"] .usuario-menu {
    gap: 10px;
    padding: 4px 10px 4px 4px;
    border-radius: var(--mod-radio);
    font-size: 14px;
    font-weight: 500;
    color: var(--t-barra-texto);
    transition: background-color .15s ease;
}
[data-piel="moderna"] .usuario-menu:hover { background: var(--t-barra-hover); color: var(--t-barra-texto-fuerte); }
/* Botón «Apariencia» (piel y tono): mismo lenguaje que los botones de la barra */
[data-piel="moderna"] .boton-apariencia { background: transparent; border: 1px solid var(--t-barra-borde); border-radius: 4px; color: var(--t-barra-texto); text-transform: uppercase; letter-spacing: .06em; font-size: 11px; font-weight: 600; padding: 6px 10px; }
[data-piel="moderna"] .boton-apariencia .bi { color: #F59E0B; font-size: 15px; }
[data-piel="moderna"] .boton-apariencia:hover, [data-piel="moderna"] .boton-apariencia[aria-expanded="true"] { background: var(--t-barra-hover); color: var(--t-barra-texto-fuerte); border-color: #F59E0B; }
[data-piel="moderna"] .boton-apariencia.dropdown-toggle::after { color: var(--t-barra-rotulo); }
[data-piel="moderna"] .menu-apariencia-opciones .descripcion-opcion { color: var(--t-texto-3); opacity: 1; }
[data-piel="moderna"] .menu-apariencia-opciones .dropdown-item.active .descripcion-opcion { color: inherit; }
[data-piel="moderna"] .usuario-menu.dropdown-toggle::after { color: var(--t-barra-rotulo); }
[data-piel="moderna"] .boton-buscar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: var(--mod-radio);
    font-size: 18px;
    color: var(--t-barra-rotulo);
    transition: background-color .15s ease, color .15s ease;
}
[data-piel="moderna"] .boton-buscar:hover, [data-piel="moderna"] .boton-buscar[aria-expanded="true"] { background: var(--t-barra-hover); color: var(--mod-acento); }

/* Búsqueda rápida: el mismo form, como panel oscuro con campos subrayados */
[data-piel="moderna"] #bloque-buscar {
    right: 20px;
    top: calc(var(--barra-alto) + 6px);
    width: min(46rem, calc(100vw - 32px));
}
[data-piel="moderna"] .contenedor-bloque-buscar {
    height: auto;
    margin: 0;
    padding: 10px;
    gap: 8px;
    align-items: center;
    border: 1px solid var(--t-borde-fuerte);
    border-top: 3px solid var(--mod-acento);
    border-radius: var(--mod-radio-grande);
    background: var(--t-panel);
    box-shadow: var(--t-sombra);
}
[data-piel="moderna"] .contenedor-bloque-buscar input[type="text"],
[data-piel="moderna"] .contenedor-bloque-buscar select {
    height: 38px;
    padding: 0 10px;
    border: 0;
    border-bottom: 2px solid var(--t-campo-linea);
    border-radius: 0;
    background: var(--t-campo);
    color: var(--t-texto-campo);
    font-size: 14px;
}
[data-piel="moderna"] .contenedor-bloque-buscar input[type="text"]:focus,
[data-piel="moderna"] .contenedor-bloque-buscar select:focus { border-bottom-color: var(--mod-acento); background: var(--t-campo-foco); box-shadow: none; outline: 0; }
[data-piel="moderna"] .contenedor-bloque-buscar select { padding-right: 28px; }
[data-piel="moderna"] .contenedor-bloque-buscar input[type="button"],
[data-piel="moderna"] .contenedor-bloque-buscar input[type="submit"] {
    height: 38px;
    padding: 0 16px;
    border-radius: var(--mod-radio);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    opacity: 1;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
[data-piel="moderna"] .contenedor-bloque-buscar input[type="button"] { background: transparent; border: 2px solid var(--t-borde-fuerte); color: var(--t-texto-2); }
[data-piel="moderna"] .contenedor-bloque-buscar input[type="button"]:hover { border-color: var(--t-borde-foco); background: var(--t-cabecera); color: var(--t-texto-fuerte); }
[data-piel="moderna"] .contenedor-bloque-buscar input[type="submit"] { background: var(--mod-acento); border: 2px solid var(--mod-acento); color: var(--mod-acento-texto); }
[data-piel="moderna"] .contenedor-bloque-buscar input[type="submit"]:hover { background: var(--mod-acento-hover); border-color: var(--mod-acento-hover); color: var(--mod-acento-texto); }

/* Menú desplegable del usuario (oscuro) */
[data-piel="moderna"] .dropdown-menu {
    --bs-dropdown-bg: var(--t-panel);
    --bs-dropdown-color: var(--t-texto);
    --bs-dropdown-link-color: var(--t-texto);
    --bs-dropdown-link-hover-color: var(--t-texto-fuerte);
    --bs-dropdown-link-hover-bg: var(--t-cabecera);
    --bs-dropdown-link-active-color: var(--t-acento-claro);
    --bs-dropdown-link-active-bg: var(--t-acento-suave);
    --bs-dropdown-border-color: var(--t-borde-fuerte);
    --bs-dropdown-border-radius: var(--mod-radio-grande);
    --bs-dropdown-divider-bg: var(--t-borde);
    --bs-dropdown-header-color: var(--t-texto-apagado);
    --bs-dropdown-item-padding-x: 10px;
    --bs-dropdown-item-padding-y: 8px;
    --bs-dropdown-font-size: 14px;
    --bs-dropdown-min-width: 14rem;
    padding: 6px;
    border-top: 3px solid var(--mod-acento);
    box-shadow: var(--t-sombra);
}
[data-piel="moderna"] .dropdown-item { display: flex; align-items: center; gap: 8px; border-radius: var(--mod-radio); color: var(--t-texto); }
[data-piel="moderna"] .dropdown-item:hover, [data-piel="moderna"] .dropdown-item:focus { background: var(--t-cabecera); color: var(--t-texto-fuerte); }
[data-piel="moderna"] .dropdown-item.active, [data-piel="moderna"] .dropdown-item:active { background: var(--t-acento-suave); color: var(--t-acento-claro); }
[data-piel="moderna"] .dropdown-item .bi { font-size: 15px; width: 18px; text-align: center; color: var(--t-acento-fg); }
[data-piel="moderna"] .dropdown-item-text { color: var(--t-texto-3); font-size: 13px; }
[data-piel="moderna"] .dropdown-header { font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; padding: 6px 10px 2px; color: var(--t-texto-apagado); }
[data-piel="moderna"] .form-piel { margin: 0; }
[data-piel="moderna"] .form-piel .dropdown-item { width: 100%; }
[data-piel="moderna"] .form-piel .dropdown-item.active .bi { color: var(--t-acento-claro); }
/* La Moderna ya es oscura: si el conmutador «Modo oscuro» llegara a dibujarse, no se muestra */
[data-piel="moderna"] #tema-toggle { display: none !important; }

/* ---------- Contenido y paneles (planos, barra ámbar a la izquierda) ---------- */
[data-piel="moderna"] .right_col { padding: 20px 24px 28px; background: var(--t-fondo); }
[data-piel="moderna"] .x_panel {
    margin-bottom: 18px;
    padding: 0 0 18px;
    border: 1px solid var(--t-borde);
    border-left: 5px solid var(--mod-acento);
    border-radius: var(--mod-radio-grande);
    background: var(--t-panel);
    box-shadow: none;
    color: var(--t-texto);
    overflow: visible;
}
[data-piel="moderna"] .x_title {
    margin: 0 0 16px;
    padding: 12px 20px;
    gap: 10px;
    min-height: 50px;
    background: var(--t-cabecera);
    border-bottom: 1px solid var(--t-borde);
    border-radius: 0 var(--mod-radio-grande) 0 0;
}
[data-piel="moderna"] .x_title h2 {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--t-texto-fuerte);
}
[data-piel="moderna"] .x_title h2::before {
    font-family: 'bootstrap-icons';
    font-weight: normal;
    font-size: 17px;
    line-height: 1;
    color: var(--t-acento-fg);
    content: "\f227"; /* bi-card-list */
}
[data-piel="moderna"] .x_title h2 .bi:first-child { display: none; } /* el visor trae su propio ícono: va el de la ruta */
[data-piel="moderna"] body[data-ruta="form_busqueda_normas"] .x_title h2::before,
[data-piel="moderna"] body[data-ruta="_search_norma"] .x_title h2::before,
[data-piel="moderna"] body[data-ruta="norma_ver"] .x_title h2::before,
[data-piel="moderna"] body[data-ruta="admin_norma"] .x_title h2::before,
[data-piel="moderna"] body[data-ruta="admin_normaVaria"] .x_title h2::before { content: "\f3ff"; } /* bi-hammer */
[data-piel="moderna"] body[data-ruta="form_busqueda_expedientes"] .x_title h2::before,
[data-piel="moderna"] body[data-ruta="expediente_ver"] .x_title h2::before,
[data-piel="moderna"] body[data-ruta="_busqueda_proyectos_comision"] .x_title h2::before,
[data-piel="moderna"] body[data-ruta="admin_proyecto"] .x_title h2::before { content: "\f3d8"; } /* bi-folder2-open */
[data-piel="moderna"] body[data-ruta="form_busqueda_sesiones"] .x_title h2::before,
[data-piel="moderna"] body[data-ruta="sesion_ver"] .x_title h2::before,
[data-piel="moderna"] body[data-ruta="admin_sesion"] .x_title h2::before { content: "\f4cf"; } /* bi-people-fill */
[data-piel="moderna"] body[data-ruta="listar_ultimos_pases"] .x_title h2::before,
[data-piel="moderna"] body[data-ruta="_busqueda_ultimos_pases"] .x_title h2::before { content: "\f292"; } /* bi-clock-history */
[data-piel="moderna"] body[data-ruta="_panel_administrador"] .x_title h2::before { content: "\f3e5"; } /* bi-gear */
[data-piel="moderna"] body[data-ruta="admin_logs"] .x_title h2::before { content: "\f444"; } /* bi-journal-text */
[data-piel="moderna"] body[data-ruta="_estadisticas"] .x_title h2::before { content: "\f17e"; } /* bi-bar-chart */
[data-piel="moderna"] body[data-ruta="admin_vencimientos"] .x_title h2::before { content: "\f110"; } /* bi-alarm */
[data-piel="moderna"] body[data-ruta="admin_user"] .x_title h2::before { content: "\f4e1"; } /* bi-person */
[data-piel="moderna"] body[data-ruta="admin_cheque"] .x_title h2::before { content: "\f25a"; } /* bi-cash-stack */
[data-piel="moderna"] body[data-ruta="admin_export"] .x_title h2::before { content: "\f2a3"; } /* bi-cloud-upload */
[data-piel="moderna"] body[data-ruta="documento_visor"] .x_title h2::before { content: "\f63e"; } /* bi-file-earmark-pdf */
[data-piel="moderna"] body[data-ruta="cambiar_clave"] .x_title h2::before { content: "\f44f"; } /* bi-key */
[data-piel="moderna"] .x_title h2 small { font-size: 12px; font-weight: 400; letter-spacing: .02em; text-transform: none; color: var(--t-texto-3); opacity: 1; }
[data-piel="moderna"] .panel_toolbox { gap: 4px; align-items: center; }
[data-piel="moderna"] .panel_toolbox .collapse-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: var(--mod-radio);
    font-size: 15px;
    color: var(--t-texto-3);
    transition: background-color .15s ease, color .15s ease;
}
[data-piel="moderna"] .panel_toolbox .collapse-link:hover { background: var(--t-cabecera-hover); color: var(--t-acento-fg); }
[data-piel="moderna"] .x_content { padding: 0 20px; }
[data-piel="moderna"] .card {
    --bs-card-bg: var(--t-panel);
    --bs-card-border-color: var(--t-borde);
    --bs-card-border-radius: var(--mod-radio-grande);
    --bs-card-inner-border-radius: calc(var(--mod-radio-grande) - 1px);
    --bs-card-cap-bg: var(--t-cabecera);
    --bs-card-color: var(--t-texto);
    --bs-card-cap-color: var(--t-texto-fuerte);
    border-left: 5px solid var(--mod-acento);
    box-shadow: none;
}
[data-piel="moderna"] .card-header { font-weight: 600; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--t-texto-fuerte); }
[data-piel="moderna"] .list-group { --bs-list-group-bg: var(--t-panel); --bs-list-group-color: var(--t-texto); --bs-list-group-border-color: var(--t-borde); }

/* ---------- Avisos: fondo oscuro tintado, borde izquierdo de color, texto claro ---------- */
[data-piel="moderna"] .alert {
    --bs-alert-border: 1px solid var(--t-borde);
    --bs-alert-bg: var(--t-cabecera);
    --bs-alert-color: var(--t-texto);
    border-left: 4px solid var(--mod-acento);
    border-radius: var(--mod-radio);
    padding: 12px 16px;
    font-size: 14px;
    color: var(--t-texto);
}
[data-piel="moderna"] .alert-dismissible { padding-right: 44px; }
[data-piel="moderna"] .alert-primary, [data-piel="moderna"] .alert-info { --bs-alert-bg: var(--t-acento-suave); --bs-alert-color: var(--t-texto); --bs-alert-border-color: rgba(245, 158, 11, .3); border-left-color: var(--mod-acento); }
[data-piel="moderna"] .alert-success { --bs-alert-bg: var(--t-verde-suave); --bs-alert-color: var(--t-texto); --bs-alert-border-color: rgba(34, 197, 94, .3); border-left-color: var(--mod-verde); }
[data-piel="moderna"] .alert-danger { --bs-alert-bg: var(--t-rojo-suave); --bs-alert-color: var(--t-texto); --bs-alert-border-color: rgba(239, 68, 68, .35); border-left-color: var(--mod-rojo); }
[data-piel="moderna"] .alert-warning { --bs-alert-bg: var(--t-acento-suave); --bs-alert-color: var(--t-texto); --bs-alert-border-color: rgba(245, 158, 11, .3); border-left-color: var(--mod-acento); }
[data-piel="moderna"] .alert-secondary, [data-piel="moderna"] .alert-light, [data-piel="moderna"] .alert-dark { --bs-alert-bg: var(--t-cabecera); --bs-alert-color: var(--t-texto); border-left-color: var(--t-borde-fuerte); }
[data-piel="moderna"] .alert .alert-link { color: var(--t-acento-claro); font-weight: 600; }
[data-piel="moderna"] .alert .bi { color: inherit; }
[data-piel="moderna"] .alert-danger .bi { color: var(--t-rojo-texto); }
[data-piel="moderna"] .alert-success .bi { color: var(--t-verde-texto); }
[data-piel="moderna"] .alert-warning .bi, [data-piel="moderna"] .alert-info .bi { color: var(--t-acento-claro); }

/* ---------- Botones: rectos, mayúsculas 12 px ---------- */
[data-piel="moderna"] .btn {
    --bs-btn-border-radius: var(--mod-radio);
    --bs-btn-font-size: 12px;
    --bs-btn-font-weight: 700;
    --bs-btn-padding-x: 16px;
    --bs-btn-padding-y: 7px;
    --bs-btn-line-height: 1.4;
    --bs-btn-border-width: 2px;
    --bs-btn-focus-box-shadow: 0 0 0 3px var(--mod-halo);
    --bs-btn-box-shadow: none;
    --bs-btn-active-shadow: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 36px;
    letter-spacing: .06em;
    text-transform: uppercase;
    background-image: none;
    box-shadow: none;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
[data-piel="moderna"] .btn .bi { font-size: 1.15em; line-height: 1; }
[data-piel="moderna"] .btn-sm { --bs-btn-font-size: 11px; --bs-btn-padding-x: 12px; --bs-btn-padding-y: 4px; min-height: 30px; }
[data-piel="moderna"] .btn-lg { --bs-btn-font-size: 13px; --bs-btn-padding-x: 20px; --bs-btn-padding-y: 10px; min-height: 44px; }
[data-piel="moderna"] .btn:focus-visible { box-shadow: 0 0 0 3px var(--mod-halo); outline: 0; }
[data-piel="moderna"] .btn.rounded-pill { border-radius: var(--mod-radio) !important; }
/* Principal: ámbar con texto oscuro (buscar, aceptar, nuevo, crear...) */
[data-piel="moderna"] .btn-primary,
[data-piel="moderna"] .btn-buscar,
[data-piel="moderna"] .x_title .btn-success,
[data-piel="moderna"] .x_title .btn-warning,
[data-piel="moderna"] #boton-nuevo-expediente,
[data-piel="moderna"] #boton-nuevo {
    --bs-btn-color: var(--mod-acento-texto);
    --bs-btn-bg: var(--mod-acento);
    --bs-btn-border-color: var(--mod-acento);
    --bs-btn-hover-color: var(--mod-acento-texto);
    --bs-btn-hover-bg: var(--mod-acento-hover);
    --bs-btn-hover-border-color: var(--mod-acento-hover);
    --bs-btn-active-color: var(--mod-acento-texto);
    --bs-btn-active-bg: var(--mod-acento-activo);
    --bs-btn-active-border-color: var(--mod-acento-activo);
    --bs-btn-disabled-color: var(--mod-acento-texto);
    --bs-btn-disabled-bg: var(--mod-acento);
    --bs-btn-disabled-border-color: var(--mod-acento);
    background: var(--mod-acento);
    border-color: var(--mod-acento);
    color: var(--mod-acento-texto);
}
[data-piel="moderna"] .btn-buscar:hover, [data-piel="moderna"] #boton-nuevo-expediente:hover, [data-piel="moderna"] #boton-nuevo:hover,
[data-piel="moderna"] .x_title .btn-success:hover, [data-piel="moderna"] .x_title .btn-warning:hover { background: var(--mod-acento-hover); border-color: var(--mod-acento-hover); color: var(--mod-acento-texto); }
[data-piel="moderna"] .btn-buscar:active, [data-piel="moderna"] #boton-nuevo-expediente:active, [data-piel="moderna"] #boton-nuevo:active { background: var(--mod-acento-activo); border-color: var(--mod-acento-activo); color: var(--mod-acento-texto); }
[data-piel="moderna"] .btn-buscar::before { font-family: 'bootstrap-icons'; content: "\f52a"; font-size: 15px; line-height: 1; font-weight: normal; } /* bi-search */
/* Secundario: transparente con borde de 2 px */
[data-piel="moderna"] .btn-outline-secondary,
[data-piel="moderna"] .btn-secondary,
[data-piel="moderna"] .btn-limpiar,
[data-piel="moderna"] .btn-warning,
[data-piel="moderna"] .btn-light,
[data-piel="moderna"] .btn-outline-light,
[data-piel="moderna"] .btn-outline-dark {
    --bs-btn-color: var(--t-texto-2);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--t-borde-fuerte);
    --bs-btn-hover-color: var(--t-texto-fuerte);
    --bs-btn-hover-bg: var(--t-cabecera);
    --bs-btn-hover-border-color: var(--t-borde-foco);
    --bs-btn-active-color: var(--t-texto-fuerte);
    --bs-btn-active-bg: var(--t-cabecera);
    --bs-btn-active-border-color: var(--mod-acento);
    --bs-btn-disabled-color: var(--t-texto-apagado);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--t-borde);
    background: transparent;
    border-color: var(--t-borde-fuerte);
    color: var(--t-texto-2);
}
[data-piel="moderna"] .btn-limpiar:hover, [data-piel="moderna"] .btn-warning:hover, [data-piel="moderna"] .btn-secondary:hover { background: var(--t-cabecera); border-color: var(--t-borde-foco); color: var(--t-texto-fuerte); }
[data-piel="moderna"] .btn-limpiar::before { font-family: 'bootstrap-icons'; content: "\f331"; font-size: 15px; line-height: 1; font-weight: normal; } /* bi-eraser */
/* Terciario: contorno ámbar (editar, descargar, «Administrar») */
[data-piel="moderna"] .btn-info,
[data-piel="moderna"] .btn-outline-primary,
[data-piel="moderna"] .btn-outline-info,
[data-piel="moderna"] .btn-outline-warning {
    --bs-btn-color: var(--t-acento-fg);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--mod-acento);
    --bs-btn-hover-color: var(--mod-acento-texto);
    --bs-btn-hover-bg: var(--mod-acento);
    --bs-btn-hover-border-color: var(--mod-acento);
    --bs-btn-active-color: var(--mod-acento-texto);
    --bs-btn-active-bg: var(--mod-acento-activo);
    --bs-btn-active-border-color: var(--mod-acento-activo);
    --bs-btn-disabled-color: var(--t-texto-apagado);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--t-borde-fuerte);
}
[data-piel="moderna"] .btn-success {
    --bs-btn-color: #FFFFFF;
    --bs-btn-bg: var(--mod-verde-fondo);
    --bs-btn-border-color: var(--mod-verde-fondo);
    --bs-btn-hover-color: #FFFFFF;
    --bs-btn-hover-bg: var(--mod-verde-fondo-hover);
    --bs-btn-hover-border-color: var(--mod-verde-fondo-hover);
    --bs-btn-active-color: #FFFFFF;
    --bs-btn-active-bg: var(--mod-verde-fondo-activo);
    --bs-btn-active-border-color: var(--mod-verde-fondo-activo);
    --bs-btn-disabled-color: #FFFFFF;
    --bs-btn-disabled-bg: var(--mod-verde-fondo);
    --bs-btn-disabled-border-color: var(--mod-verde-fondo);
}
[data-piel="moderna"] .btn-outline-success {
    --bs-btn-color: var(--t-verde-texto);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--mod-verde);
    --bs-btn-hover-color: #FFFFFF;
    --bs-btn-hover-bg: var(--mod-verde-fondo);
    --bs-btn-hover-border-color: var(--mod-verde-fondo);
    --bs-btn-active-color: #FFFFFF;
    --bs-btn-active-bg: var(--mod-verde-fondo);
    --bs-btn-active-border-color: var(--mod-verde-fondo);
}
[data-piel="moderna"] .btn-danger {
    --bs-btn-color: #FFFFFF;
    --bs-btn-bg: var(--mod-rojo-fondo);
    --bs-btn-border-color: var(--mod-rojo-fondo);
    --bs-btn-hover-color: #FFFFFF;
    --bs-btn-hover-bg: var(--mod-rojo-fondo-hover);
    --bs-btn-hover-border-color: var(--mod-rojo-fondo-hover);
    --bs-btn-active-color: #FFFFFF;
    --bs-btn-active-bg: var(--mod-rojo-fondo-activo);
    --bs-btn-active-border-color: var(--mod-rojo-fondo-activo);
    --bs-btn-disabled-color: #FFFFFF;
    --bs-btn-disabled-bg: var(--mod-rojo-fondo);
    --bs-btn-disabled-border-color: var(--mod-rojo-fondo);
}
[data-piel="moderna"] .btn-outline-danger {
    --bs-btn-color: var(--t-rojo-texto);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--mod-rojo);
    --bs-btn-hover-color: #FFFFFF;
    --bs-btn-hover-bg: var(--mod-rojo-fondo);
    --bs-btn-hover-border-color: var(--mod-rojo-fondo);
    --bs-btn-active-color: #FFFFFF;
    --bs-btn-active-bg: var(--mod-rojo-fondo-hover);
    --bs-btn-active-border-color: var(--mod-rojo-fondo-hover);
}
[data-piel="moderna"] .btn-link { --bs-btn-color: var(--t-acento-fg); --bs-btn-hover-color: var(--t-acento-fg-hover); text-decoration: none; }
[data-piel="moderna"] .btn-link:hover { text-decoration: underline; }
[data-piel="moderna"] .form-busqueda .btn, [data-piel="moderna"] .botonera .btn { border-radius: var(--mod-radio); }
[data-piel="moderna"] .botonera { gap: 10px; padding-bottom: 4px; }
[data-piel="moderna"] .ln_solid { margin: 4px 0 16px; border-color: var(--t-borde); }
[data-piel="moderna"] .x_title .btn { min-height: 32px; }

/* Acciones de las tablas: botones de ícono cuadrados (el texto va en el tooltip, app.js) */
[data-piel="moderna"] .columna-opciones .btn,
[data-piel="moderna"] .tabla-gestion .columna-opciones .btn,
[data-piel="moderna"] .tabla-normativa .columna-opciones .btn,
[data-piel="moderna"] .tabla-busqueda .btn-ver {
    width: 32px;
    height: 32px;
    min-height: 0;
    margin: 0 4px 2px 0;
    padding: 0;
    border-radius: var(--mod-radio);
    font-size: 15px;
    --bs-btn-border-width: 0;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-border-color: transparent;
    --bs-btn-color: var(--mod-acento-texto);
    --bs-btn-bg: var(--mod-acento);
    --bs-btn-hover-color: var(--mod-acento-texto);
    --bs-btn-hover-bg: var(--mod-acento-hover);
    --bs-btn-active-color: var(--mod-acento-texto);
    --bs-btn-active-bg: var(--mod-acento-activo);
    background: var(--mod-acento);
    border: 0;
    color: var(--mod-acento-texto);
}
[data-piel="moderna"] .columna-opciones .btn:hover, [data-piel="moderna"] .tabla-busqueda .btn-ver:hover { background: var(--mod-acento-hover); color: var(--mod-acento-texto); }
[data-piel="moderna"] .columna-opciones .btn-success, [data-piel="moderna"] .columna-opciones .btn-outline-success {
    --bs-btn-color: var(--t-verde-texto);
    --bs-btn-bg: var(--t-verde-suave);
    --bs-btn-hover-color: #FFFFFF;
    --bs-btn-hover-bg: var(--mod-verde-fondo);
    --bs-btn-active-bg: var(--mod-verde-fondo);
    background: var(--t-verde-suave);
    color: var(--t-verde-texto);
    box-shadow: inset 0 0 0 1px var(--t-verde-borde);
}
[data-piel="moderna"] .columna-opciones .btn-success:hover, [data-piel="moderna"] .columna-opciones .btn-outline-success:hover { background: var(--mod-verde-fondo); color: #FFFFFF; box-shadow: none; }
[data-piel="moderna"] .columna-opciones .btn-danger, [data-piel="moderna"] .columna-opciones .btn-outline-danger {
    --bs-btn-color: var(--t-rojo-texto);
    --bs-btn-bg: var(--t-rojo-suave);
    --bs-btn-hover-color: #FFFFFF;
    --bs-btn-hover-bg: var(--mod-rojo-fondo);
    --bs-btn-active-bg: var(--mod-rojo-fondo);
    background: var(--t-rojo-suave);
    color: var(--t-rojo-texto);
    box-shadow: inset 0 0 0 1px var(--t-rojo-borde);
}
[data-piel="moderna"] .columna-opciones .btn-danger:hover, [data-piel="moderna"] .columna-opciones .btn-outline-danger:hover { background: var(--mod-rojo-fondo); color: #FFFFFF; box-shadow: none; }
[data-piel="moderna"] .columna-opciones .btn-info,
[data-piel="moderna"] .columna-opciones .btn-secondary,
[data-piel="moderna"] .columna-opciones .btn-warning,
[data-piel="moderna"] .columna-opciones .btn-outline-secondary {
    --bs-btn-color: var(--t-texto-2);
    --bs-btn-bg: var(--t-elevado);
    --bs-btn-hover-color: var(--mod-acento-texto);
    --bs-btn-hover-bg: var(--mod-acento);
    --bs-btn-active-bg: var(--mod-acento-activo);
    background: var(--t-elevado);
    color: var(--t-texto-2);
    box-shadow: inset 0 0 0 1px var(--t-borde-fuerte);
}
[data-piel="moderna"] .columna-opciones .btn-info:hover,
[data-piel="moderna"] .columna-opciones .btn-secondary:hover,
[data-piel="moderna"] .columna-opciones .btn-warning:hover,
[data-piel="moderna"] .columna-opciones .btn-outline-secondary:hover { background: var(--mod-acento); color: var(--mod-acento-texto); box-shadow: none; }

/* ---------- Formularios: etiqueta arriba en mayúsculas, campos subrayados ---------- */
[data-piel="moderna"] .form-busqueda .item { flex-direction: column; align-items: stretch; gap: 6px; margin-bottom: 18px; }
[data-piel="moderna"] .form-busqueda .label-align,
[data-piel="moderna"] .form-busqueda .item-ancho .label-align { flex-basis: auto; max-width: none; padding: 0; text-align: left; }
[data-piel="moderna"] .form-label, [data-piel="moderna"] .col-form-label, [data-piel="moderna"] legend.col-form-label,
[data-piel="moderna"] .form-busqueda .label-align,
[data-piel="moderna"] .form-expediente .form-label, [data-piel="moderna"] .modal-body form .form-label,
[data-piel="moderna"] .form-normativa .form-label, [data-piel="moderna"] .coleccion-entrada .form-label {
    margin-bottom: 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--t-texto-3);
}
[data-piel="moderna"] .form-label.required::after, [data-piel="moderna"] .col-form-label.required::after { content: " *"; color: var(--t-acento-fg); }
[data-piel="moderna"] .form-control, [data-piel="moderna"] .form-select,
[data-piel="moderna"] .form-busqueda .form-control, [data-piel="moderna"] .form-busqueda .form-select,
[data-piel="moderna"] .form-expediente .form-control, [data-piel="moderna"] .form-expediente .form-select,
[data-piel="moderna"] .modal-body form .form-control, [data-piel="moderna"] .modal-body form .form-select,
[data-piel="moderna"] .login-cuerpo .form-control {
    min-height: 38px;
    padding: 7px 10px;
    border: 0;
    border-bottom: 2px solid var(--t-campo-linea);
    border-radius: 0;
    background-color: var(--t-campo);
    color: var(--t-texto-campo);
    -webkit-text-fill-color: var(--t-texto-campo);
    caret-color: var(--mod-acento);
    opacity: 1;
    font-size: 14px;
    line-height: 1.5;
    box-shadow: none;
    transition: border-color .15s ease, background-color .15s ease;
}
[data-piel="moderna"] .form-control-sm, [data-piel="moderna"] .form-select-sm { min-height: 32px; padding: 4px 8px; font-size: 13px; }
[data-piel="moderna"] textarea.form-control { min-height: 96px; }
[data-piel="moderna"] .form-control:focus, [data-piel="moderna"] .form-select:focus,
[data-piel="moderna"] .login-cuerpo .form-control:focus {
    border-color: var(--mod-acento);
    box-shadow: none;
    outline: 0;
    background-color: var(--t-campo-foco);
    color: var(--t-texto-campo);
}
[data-piel="moderna"] .form-control:disabled, [data-piel="moderna"] .form-select:disabled, [data-piel="moderna"] .form-control[readonly] {
    background-color: var(--t-cabecera);
    border-bottom-style: dashed;
    color: var(--t-texto-3);
    -webkit-text-fill-color: var(--t-texto-3);
}
/* Autocompletado del navegador: que no pinte el campo de blanco ni apague el texto */
[data-piel="moderna"] input:-webkit-autofill, [data-piel="moderna"] input:-webkit-autofill:hover,
[data-piel="moderna"] input:-webkit-autofill:focus, [data-piel="moderna"] textarea:-webkit-autofill, [data-piel="moderna"] select:-webkit-autofill {
    -webkit-text-fill-color: var(--t-texto-campo);
    -webkit-box-shadow: 0 0 0 1000px var(--t-campo) inset;
    box-shadow: 0 0 0 1000px var(--t-campo) inset;
    caret-color: var(--mod-acento);
    transition: background-color 9999s ease-in-out 0s;
}
/* select nativo: flecha clara (SVG) */
[data-piel="moderna"] .form-select, [data-piel="moderna"] .contenedor-bloque-buscar select, [data-piel="moderna"] .visor-barra select, [data-piel="moderna"] div.dt-container .dt-length select {
    background-image: var(--t-flecha);
    background-repeat: no-repeat;
    background-position: right .6rem center;
    background-size: 14px 11px;
    padding-right: 2rem;
    -webkit-appearance: none;
    appearance: none;
}
[data-piel="moderna"] .form-select option, [data-piel="moderna"] select option { background: var(--t-panel); color: var(--t-texto); }
[data-piel="moderna"] .form-select[multiple], [data-piel="moderna"] .form-select[size]:not([size="1"]) { background-image: none; padding-right: 10px; }
/* fecha, número, búsqueda: los íconos nativos siguen el color-scheme del tono (en <html>, se hereda) */
[data-piel="moderna"] input[type="date"]::-webkit-calendar-picker-indicator { opacity: .85; cursor: pointer; }
[data-piel="moderna"] input[type="date"]::-webkit-calendar-picker-indicator:hover { opacity: 1; }
/* archivos */
[data-piel="moderna"] .form-control[type="file"] { padding: 0; overflow: hidden; }
[data-piel="moderna"] .form-control[type="file"]::file-selector-button {
    margin: 0 10px 0 0;
    padding: 8px 12px;
    border: 0;
    border-right: 2px solid var(--t-campo-linea);
    background: var(--t-elevado);
    color: var(--t-texto-2);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    transition: background-color .15s ease, color .15s ease;
}
[data-piel="moderna"] .form-control[type="file"]:hover:not(:disabled):not([readonly])::file-selector-button { background: var(--mod-acento); color: var(--mod-acento-texto); }
[data-piel="moderna"] .form-control-sm[type="file"]::file-selector-button { padding: 5px 10px; }
/* validación */
[data-piel="moderna"] .form-control.is-invalid, [data-piel="moderna"] .form-select.is-invalid, [data-piel="moderna"] .ts-wrapper.is-invalid { border-bottom-color: var(--mod-rojo); background-position: right .6rem center; }
[data-piel="moderna"] .form-control.is-invalid:focus, [data-piel="moderna"] .form-select.is-invalid:focus { border-bottom-color: var(--mod-rojo); box-shadow: none; }
[data-piel="moderna"] .form-control.is-valid, [data-piel="moderna"] .form-select.is-valid { border-bottom-color: var(--mod-verde); }
[data-piel="moderna"] .invalid-feedback { color: var(--t-rojo-texto); font-size: 12px; font-weight: 500; }
[data-piel="moderna"] .invalid-feedback ul { margin: 0; padding-left: 16px; }
[data-piel="moderna"] .valid-feedback { color: var(--t-verde-texto); font-size: 12px; }
[data-piel="moderna"] .form-text { color: var(--t-texto-3); font-size: 12px; }
[data-piel="moderna"] .verificacion-aviso, [data-piel="moderna"] #siem-respuesta, [data-piel="moderna"] [data-siem-respuesta], [data-piel="moderna"] [data-unico-respuesta] { font-size: 12px; margin-top: 2px; }
/* casillas y radios */
[data-piel="moderna"] .form-check-input {
    width: 1.1em;
    height: 1.1em;
    margin-top: .18em;
    border: 2px solid var(--t-borde-foco);
    background-color: var(--t-campo);
    accent-color: var(--mod-acento);
    box-shadow: none;
}
[data-piel="moderna"] .form-check-input:checked { background-color: var(--mod-acento); border-color: var(--mod-acento); }
[data-piel="moderna"] .form-check-input:checked[type="checkbox"] { --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%231C1917' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e"); }
[data-piel="moderna"] .form-check-input:checked[type="radio"] { --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%231C1917'/%3e%3c/svg%3e"); }
[data-piel="moderna"] .form-check-input:focus { border-color: var(--mod-acento); box-shadow: 0 0 0 3px var(--mod-halo); }
[data-piel="moderna"] .form-check-input:disabled { opacity: .5; }
[data-piel="moderna"] .form-check-label { font-size: 14px; color: var(--t-texto); }
[data-piel="moderna"] .form-switch .form-check-input { background-image: var(--t-switch); }
[data-piel="moderna"] .form-switch .form-check-input:checked { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%231C1917'/%3e%3c/svg%3e"); }
[data-piel="moderna"] .input-group-text { border: 0; border-bottom: 2px solid var(--t-campo-linea); border-radius: 0; background: var(--t-cabecera); color: var(--t-texto-3); font-size: 13px; }
[data-piel="moderna"] .siem-partes { gap: 6px; }
[data-piel="moderna"] .siem-partes span, [data-piel="moderna"] .entre-fechas span { color: var(--t-texto-apagado); }
[data-piel="moderna"] .siem-partes input { padding-left: .25rem; padding-right: .25rem; }
[data-piel="moderna"] .panel-busqueda-expedientes {
    margin: 0 0 16px;
    padding: 16px 16px 0;
    border: 1px solid var(--t-borde);
    border-left: 3px solid var(--t-borde-fuerte);
    border-radius: var(--mod-radio-grande);
    background: var(--t-cabecera);
}
/* Cajas con borde dentro de los formularios (vencimiento, documentos, quitar documentos) y entradas de colección */
[data-piel="moderna"] .modal-body form .border.rounded, [data-piel="moderna"] .coleccion-entrada {
    border: 1px solid var(--t-borde) !important;
    border-left: 3px solid var(--t-borde-fuerte) !important;
    border-radius: var(--mod-radio-grande) !important;
    background: var(--t-cabecera);
}
[data-piel="moderna"] .coleccion-entrada { padding: 10px 12px 2px; margin-bottom: 8px; }
[data-piel="moderna"] .modal-body form .border.rounded .fw-bold { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--t-texto-3); }

/* Tom Select: el mismo trazo subrayado; desplegable oscuro */
[data-piel="moderna"] .ts-wrapper.form-select, [data-piel="moderna"] .ts-wrapper.form-control { min-height: 38px; padding: 0 !important; border: 0; border-bottom: 2px solid var(--t-campo-linea); border-radius: 0; background-color: var(--t-campo); font-size: 14px; box-shadow: none; }
[data-piel="moderna"] .ts-wrapper.multi.form-select, [data-piel="moderna"] .ts-wrapper.multi.form-control { background-image: none; padding-right: 0 !important; }
[data-piel="moderna"] .ts-wrapper.focus, [data-piel="moderna"] .ts-wrapper.focus.form-select, [data-piel="moderna"] .ts-wrapper.focus.form-control { border-bottom-color: var(--mod-acento); background-color: var(--t-campo-foco); box-shadow: none; }
[data-piel="moderna"] .ts-wrapper .ts-control, [data-piel="moderna"] .ts-wrapper.form-select .ts-control, [data-piel="moderna"] .ts-wrapper.form-control .ts-control {
    min-height: 36px;
    padding: 5px 10px;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
    color: var(--t-texto-campo);
    font-size: 14px;
    box-shadow: none !important;
}
[data-piel="moderna"] .ts-wrapper.focus .ts-control { box-shadow: none !important; border: 0 !important; }
[data-piel="moderna"] .ts-control, [data-piel="moderna"] .ts-control input, [data-piel="moderna"] .ts-dropdown { color: var(--t-texto-campo); font-family: inherit; }
[data-piel="moderna"] .ts-control input::placeholder { color: var(--t-placeholder) !important; }
[data-piel="moderna"] .ts-wrapper:not(.form-control, .form-select).single .ts-control {
    background-image: var(--t-flecha);
}
[data-piel="moderna"] .ts-wrapper.multi .ts-control > div, [data-piel="moderna"] .ts-wrapper.multi .ts-control > .item {
    margin: 2px 4px 2px 0;
    padding: 2px 8px;
    border: 1px solid var(--t-acento-borde);
    border-radius: var(--mod-radio);
    background: var(--t-acento-suave);
    color: var(--t-acento-claro);
    font-size: 13px;
    font-weight: 500;
}
[data-piel="moderna"] .ts-wrapper.multi .ts-control > div.active, [data-piel="moderna"] .ts-wrapper.multi .ts-control > .item.active { background: var(--mod-acento); color: var(--mod-acento-texto); border-color: var(--mod-acento); }
[data-piel="moderna"] .ts-wrapper.plugin-remove_button:not(.rtl) .item .remove { border-left-color: var(--t-acento-borde); color: inherit; }
[data-piel="moderna"] .ts-wrapper.plugin-remove_button .item .remove:hover { background: var(--t-acento-suave-2); }
[data-piel="moderna"] .ts-dropdown, [data-piel="moderna"] .ts-dropdown.form-control, [data-piel="moderna"] .ts-dropdown.form-select {
    margin-top: 2px;
    border: 1px solid var(--t-borde-fuerte);
    border-top: 2px solid var(--mod-acento);
    border-radius: 0 0 var(--mod-radio-grande) var(--mod-radio-grande);
    background: var(--t-panel);
    color: var(--t-texto);
    box-shadow: var(--t-sombra);
    font-size: 14px;
    overflow: hidden;
}
[data-piel="moderna"] .ts-dropdown .option, [data-piel="moderna"] .ts-dropdown .no-results, [data-piel="moderna"] .ts-dropdown .create { padding: 7px 12px; color: var(--t-texto); }
[data-piel="moderna"] .ts-dropdown .no-results { color: var(--t-texto-3); }
[data-piel="moderna"] .ts-dropdown .active, [data-piel="moderna"] .ts-dropdown .active.create { background: var(--t-acento-suave); color: var(--t-acento-claro); }
[data-piel="moderna"] .ts-dropdown .option.selected { background: var(--t-cabecera); }
[data-piel="moderna"] .ts-dropdown .optgroup-header { background: var(--t-cabecera); color: var(--t-texto-3); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
[data-piel="moderna"] .ts-dropdown [data-selectable] .highlight { background: var(--t-seleccion); color: inherit; }
[data-piel="moderna"] .ts-dropdown .spinner::after { border-color: var(--mod-acento) transparent; }
[data-piel="moderna"] .ts-wrapper.disabled .ts-control, [data-piel="moderna"] .ts-wrapper.disabled { background-color: var(--t-cabecera); opacity: .7; }

/* ---------- Tablas ---------- */
[data-piel="moderna"] .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--t-texto);
    --bs-table-border-color: var(--t-borde);
    --bs-table-striped-bg: var(--t-zebra);
    --bs-table-striped-color: var(--t-texto);
    --bs-table-hover-bg: var(--t-hover);
    --bs-table-hover-color: var(--t-texto);
    --bs-table-active-bg: var(--t-acento-suave);
    --bs-table-active-color: var(--t-texto-fuerte);
    font-size: 14px;
    color: var(--t-texto);
}
[data-piel="moderna"] .tabla-busqueda { font-size: 14px; }
[data-piel="moderna"] .table-bordered > :not(caption) > * { border-width: 0; }
[data-piel="moderna"] .table-bordered > :not(caption) > * > * { border-width: 0 0 1px; }
[data-piel="moderna"] .table > :not(caption) > * > * { padding: 10px 12px; border-bottom: 1px solid var(--t-borde); color: var(--t-texto); }
[data-piel="moderna"] .table-sm > :not(caption) > * > * { padding: 6px 8px; }
[data-piel="moderna"] .table thead th, [data-piel="moderna"] .tabla-busqueda thead th, [data-piel="moderna"] table.dataTable thead > tr > th {
    background: var(--t-cabecera) !important;
    color: var(--t-cabecera-texto);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
    border-bottom: 3px solid var(--mod-acento) !important;
}
[data-piel="moderna"] .table tbody th { color: var(--t-texto-2); font-weight: 600; font-size: 13px; }
[data-piel="moderna"] .table > tbody > tr:hover > * { --bs-table-bg-type: var(--t-hover); --bs-table-bg-state: var(--t-hover); color: var(--t-texto-fuerte); }
[data-piel="moderna"] .table > tbody > tr:last-child > * { border-bottom-color: var(--t-borde); }
[data-piel="moderna"] .table-warning, [data-piel="moderna"] .table-warning > * { --bs-table-bg: rgba(245, 158, 11, .14); --bs-table-color: var(--t-texto-fuerte); --bs-table-striped-bg: rgba(245, 158, 11, .14); background-color: rgba(245, 158, 11, .14); color: var(--t-texto-fuerte); }
[data-piel="moderna"] .table-danger, [data-piel="moderna"] .table-danger > * { --bs-table-bg: rgba(239, 68, 68, .16); --bs-table-color: var(--t-texto-fuerte); background-color: rgba(239, 68, 68, .16); color: var(--t-texto-fuerte); }
[data-piel="moderna"] .table-success, [data-piel="moderna"] .table-success > * { --bs-table-bg: rgba(34, 197, 94, .14); --bs-table-color: var(--t-texto-fuerte); background-color: rgba(34, 197, 94, .14); color: var(--t-texto-fuerte); }
[data-piel="moderna"] .table pre { color: inherit; background: transparent; margin: 0; }
[data-piel="moderna"] table.dataTable thead > tr > th.dt-orderable-asc:hover,
[data-piel="moderna"] table.dataTable thead > tr > th.dt-orderable-desc:hover { outline: 0; background: var(--t-cabecera-hover) !important; }
[data-piel="moderna"] table.dataTable thead > tr > th span.dt-column-order::before,
[data-piel="moderna"] table.dataTable thead > tr > th span.dt-column-order::after { color: var(--t-texto-apagado); }
[data-piel="moderna"] table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order::before,
[data-piel="moderna"] table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order::after { color: var(--t-acento-fg); opacity: 1; }
[data-piel="moderna"] table.dataTable tbody > tr > td { color: var(--t-texto); }
[data-piel="moderna"] table.dataTable tbody tr:hover > * { background: var(--t-hover) !important; }
[data-piel="moderna"] .tabla-gestion .columna-opciones .btn { margin: 0 4px 2px 0; padding: 0; }
[data-piel="moderna"] .columna-opciones a.btn { text-decoration: none; }
/* Vencimientos: vencidas en rojo oscuro, urgentes en ámbar; texto siempre claro */
[data-piel="moderna"] .vencimientos tr.vencida > * { --bs-table-bg: var(--t-vencida-fondo); --bs-table-striped-bg: var(--t-vencida-fondo); --bs-table-bg-type: var(--t-vencida-fondo); background-color: var(--t-vencida-fondo); color: var(--t-vencida-texto); }
[data-piel="moderna"] .vencimientos tr.vencida:hover > * { --bs-table-bg-state: var(--t-vencida-hover); }
[data-piel="moderna"] .vencimientos tr.urgente > * { --bs-table-bg: var(--t-urgente-fondo); --bs-table-striped-bg: var(--t-urgente-fondo); --bs-table-bg-type: var(--t-urgente-fondo); background-color: var(--t-urgente-fondo); color: var(--t-texto-fuerte); }
[data-piel="moderna"] .vencimientos .semaforo { box-shadow: 0 0 0 2px var(--t-panel); }
[data-piel="moderna"] .vencimientos .semaforo.bg-secondary-subtle { background-color: var(--t-neutro-fondo) !important; }
/* Fragmento resaltado del texto (búsqueda «Contiene») */
[data-piel="moderna"] .fragmento-texto { color: var(--t-texto-2); background: rgba(245, 158, 11, .06); border-left: 3px solid var(--mod-acento); border-radius: 0 var(--mod-radio) var(--mod-radio) 0; }
[data-piel="moderna"] .fragmento-texto mark { background: var(--mod-acento); color: var(--mod-acento-texto); }
[data-piel="moderna"] .fragmento-texto .bi { color: var(--t-acento-fg); }

/* Controles de DataTables */
[data-piel="moderna"] div.dt-container .dt-length, [data-piel="moderna"] div.dt-container .dt-search, [data-piel="moderna"] div.dt-container .dt-info { font-size: 13px; color: var(--t-texto-3); }
[data-piel="moderna"] div.dt-container .dt-length label, [data-piel="moderna"] div.dt-container .dt-search label { color: var(--t-texto-3); }
[data-piel="moderna"] div.dt-container .dt-length select,
[data-piel="moderna"] div.dt-container .dt-search input {
    min-height: 34px;
    padding: 4px 8px;
    border: 0;
    border-bottom: 2px solid var(--t-campo-linea);
    border-radius: 0;
    background-color: var(--t-campo);
    color: var(--t-texto-campo);
    font-size: 14px;
    box-shadow: none;
}
[data-piel="moderna"] div.dt-container .dt-search input:focus, [data-piel="moderna"] div.dt-container .dt-length select:focus { border-bottom-color: var(--mod-acento); box-shadow: none; }
[data-piel="moderna"] div.dt-container .dt-search input { min-width: 14rem; }
[data-piel="moderna"] div.dt-container .dt-length select { width: auto; padding-right: 2rem; }
[data-piel="moderna"] div.dt-container div.dt-layout-row { margin: 10px 0; }
[data-piel="moderna"] .pagination {
    --bs-pagination-font-size: 12px;
    --bs-pagination-padding-x: .7rem;
    --bs-pagination-padding-y: .4rem;
    --bs-pagination-color: var(--t-texto-2);
    --bs-pagination-bg: transparent;
    --bs-pagination-border-color: var(--t-borde-fuerte);
    --bs-pagination-border-radius: var(--mod-radio);
    --bs-pagination-hover-color: var(--t-texto-fuerte);
    --bs-pagination-hover-bg: var(--t-cabecera);
    --bs-pagination-hover-border-color: var(--t-borde-foco);
    --bs-pagination-focus-color: var(--t-texto-fuerte);
    --bs-pagination-focus-bg: var(--t-cabecera);
    --bs-pagination-focus-box-shadow: 0 0 0 3px var(--mod-halo);
    --bs-pagination-active-color: var(--mod-acento-texto);
    --bs-pagination-active-bg: var(--mod-acento);
    --bs-pagination-active-border-color: var(--mod-acento);
    --bs-pagination-disabled-color: var(--t-texto-apagado);
    --bs-pagination-disabled-bg: transparent;
    --bs-pagination-disabled-border-color: var(--t-borde);
    gap: 4px;
}
[data-piel="moderna"] .pagination .page-link { border-radius: var(--mod-radio) !important; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
[data-piel="moderna"] .page-item:not(:first-child) .page-link { margin-left: 0; }
[data-piel="moderna"] .page-item.active .page-link { color: var(--mod-acento-texto); background: var(--mod-acento); border-color: var(--mod-acento); }
[data-piel="moderna"] div.dt-container .dt-paging .dt-paging-button.current { background: var(--mod-acento) !important; color: var(--mod-acento-texto) !important; border-color: var(--mod-acento); }
/* Copiar / Excel / PDF / Imprimir: grupo de botones chicos con borde */
[data-piel="moderna"] div.dt-container .dt-buttons { display: inline-flex; flex-wrap: wrap; margin: 4px 0; }
[data-piel="moderna"] div.dt-container .dt-buttons .btn {
    --bs-btn-color: var(--t-texto-2);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--t-borde-fuerte);
    --bs-btn-hover-color: var(--t-texto-fuerte);
    --bs-btn-hover-bg: var(--t-cabecera);
    --bs-btn-hover-border-color: var(--t-borde-fuerte);
    --bs-btn-active-color: var(--t-acento-claro);
    --bs-btn-active-bg: var(--t-acento-suave);
    --bs-btn-active-border-color: var(--t-borde-fuerte);
    --bs-btn-border-width: 1px;
    --bs-btn-font-size: 11px;
    --bs-btn-padding-x: 12px;
    --bs-btn-padding-y: 4px;
    min-height: 32px;
    margin: 0 0 0 -1px;
    border-radius: 0;
    background: transparent;
    color: var(--t-texto-2);
}
[data-piel="moderna"] div.dt-container .dt-buttons .btn:hover { background: var(--t-cabecera); color: var(--t-texto-fuerte); z-index: 1; }
[data-piel="moderna"] div.dt-container .dt-buttons .btn:first-child { margin-left: 0; border-top-left-radius: var(--mod-radio); border-bottom-left-radius: var(--mod-radio); }
[data-piel="moderna"] div.dt-container .dt-buttons .btn:last-child { border-top-right-radius: var(--mod-radio); border-bottom-right-radius: var(--mod-radio); }
[data-piel="moderna"] div.dt-container .dt-buttons .btn::before { font-family: 'bootstrap-icons'; font-size: 14px; font-weight: normal; line-height: 1; margin-right: 6px; color: var(--t-acento-fg); }
[data-piel="moderna"] div.dt-container .dt-buttons .buttons-copy::before { content: "\f290"; }  /* bi-clipboard */
[data-piel="moderna"] div.dt-container .dt-buttons .buttons-excel::before { content: "\f389"; } /* bi-file-earmark-spreadsheet */
[data-piel="moderna"] div.dt-container .dt-buttons .buttons-pdf::before { content: "\f63e"; }   /* bi-file-earmark-pdf */
[data-piel="moderna"] div.dt-container .dt-buttons .buttons-print::before { content: "\f501"; } /* bi-printer */
[data-piel="moderna"] div.dt-processing { border-radius: var(--mod-radio-grande); background: var(--t-panel); color: var(--t-texto); box-shadow: var(--t-sombra); border: 1px solid var(--t-borde-fuerte); border-top: 3px solid var(--mod-acento); }
[data-piel="moderna"] div.dt-processing > div:last-child > div { background: var(--mod-acento); }
[data-piel="moderna"] table.dataTable > tbody > tr > td.dtr-control::before { background-color: var(--mod-acento); border-color: var(--mod-acento); color: var(--mod-acento-texto); }
[data-piel="moderna"] table.dataTable > tbody > tr > td.child, [data-piel="moderna"] table.dataTable > tbody > tr.child ul.dtr-details > li { border-color: var(--t-borde); color: var(--t-texto); }
[data-piel="moderna"] table.dataTable > tbody > tr.child span.dtr-title { color: var(--t-texto-3); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
[data-piel="moderna"] div.dt-button-info { background: var(--t-panel); border: 1px solid var(--t-borde-fuerte); border-top: 3px solid var(--mod-acento); border-radius: var(--mod-radio-grande); color: var(--t-texto); box-shadow: var(--t-sombra); }
[data-piel="moderna"] div.dt-button-info h2 { background: var(--t-cabecera); border-bottom: 1px solid var(--t-borde); color: var(--t-texto-fuerte); font-size: 13px; text-transform: uppercase; letter-spacing: .08em; }

/* ---------- Fichas ---------- */
[data-piel="moderna"] .ficha h6 { margin-bottom: 8px; font-size: 14px; font-weight: 400; line-height: 1.55; color: var(--t-texto); text-transform: none; letter-spacing: 0; }
[data-piel="moderna"] .ficha h6 strong { font-weight: 600; color: var(--t-texto-3); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
[data-piel="moderna"] .ficha h6.text-center strong { color: var(--t-texto-fuerte); }
[data-piel="moderna"] .ficha-cabecera {
    margin: 0 0 16px;
    padding: 14px 10px 6px;
    border: 1px solid var(--t-borde);
    border-left: 5px solid var(--mod-acento);
    border-radius: var(--mod-radio-grande);
    background: var(--t-fondo);
}
[data-piel="moderna"] .link-siem, [data-piel="moderna"] .link-siem a { font-size: 15px; font-weight: 600; color: var(--t-acento-fg); text-transform: none; letter-spacing: 0; }
[data-piel="moderna"] .ficha-expediente .ficha-cabecera .link-siem { color: var(--t-texto-fuerte); }
[data-piel="moderna"] .link-download-doc, [data-piel="moderna"] .link-download-doc a { font-weight: 600; color: var(--t-acento-fg); }
[data-piel="moderna"] .link-download-doc a:hover { color: var(--t-acento-fg-hover); }
[data-piel="moderna"] .link-download-doc .nombre-doc, [data-piel="moderna"] .link-download-doc .separador { color: var(--t-texto-3); }
[data-piel="moderna"] .link-download-doc > .bi-paperclip { color: var(--t-texto-3); }
[data-piel="moderna"] .ficha hr { margin: 16px 0; border-color: var(--t-borde); }
[data-piel="moderna"] .ficha-seccion {
    margin-bottom: 14px;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--t-borde);
    border-left: 5px solid var(--mod-acento);
    border-radius: var(--mod-radio-grande);
    background: var(--t-panel);
    box-shadow: none;
}
[data-piel="moderna"] .ficha-seccion-titulo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--t-borde);
    background: var(--t-cabecera);
    color: var(--t-texto-fuerte);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    transition: background-color .15s ease;
}
[data-piel="moderna"] .ficha-seccion-titulo:hover { background: var(--t-cabecera-hover); }
[data-piel="moderna"] .ficha-seccion-titulo .bi { font-size: 13px; color: var(--t-acento-fg); transition: transform .2s ease; }
[data-piel="moderna"] .ficha-seccion-titulo[aria-expanded="false"] .bi { transform: rotate(-90deg); }
[data-piel="moderna"] .ficha-seccion-titulo[aria-expanded="false"] { border-bottom-color: transparent; }
[data-piel="moderna"] .ficha-seccion-cuerpo { padding: 14px 16px 6px; }
[data-piel="moderna"] .ficha-lista { margin-bottom: 16px; }
[data-piel="moderna"] .ficha-lista-titulo {
    margin-bottom: 10px;
    padding: 0 0 6px;
    border-bottom: 1px solid var(--t-borde-fuerte);
    text-align: left;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--t-texto-3);
}
[data-piel="moderna"] .ficha table { font-size: 13px; }
[data-piel="moderna"] .ficha .ficha-enlace.btn, [data-piel="moderna"] .vencimientos .ficha-enlace, [data-piel="moderna"] .ficha a.ficha-enlace {
    min-height: 28px;
    padding: 3px 10px;
    border-radius: var(--mod-radio);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: none;
    --bs-btn-color: var(--t-acento-claro);
    --bs-btn-bg: var(--t-acento-suave);
    --bs-btn-border-color: var(--t-acento-borde);
    --bs-btn-border-width: 1px;
    --bs-btn-hover-color: var(--mod-acento-texto);
    --bs-btn-hover-bg: var(--mod-acento);
    --bs-btn-hover-border-color: var(--mod-acento);
    --bs-btn-active-color: var(--mod-acento-texto);
    --bs-btn-active-bg: var(--mod-acento-activo);
    --bs-btn-active-border-color: var(--mod-acento-activo);
    background: var(--t-acento-suave);
    color: var(--t-acento-claro);
    border: 1px solid var(--t-acento-borde);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
}
[data-piel="moderna"] .ficha .ficha-enlace.btn:hover, [data-piel="moderna"] .vencimientos .ficha-enlace:hover, [data-piel="moderna"] .ficha a.ficha-enlace:hover { background: var(--mod-acento); color: var(--mod-acento-texto); border-color: var(--mod-acento); }
[data-piel="moderna"] .modal-body .ficha { color: var(--t-texto); }
[data-piel="moderna"] .tabla-pases td { vertical-align: top; }

/* ---------- Modales (ficha, ABM, wizard) ---------- */
[data-piel="moderna"] .modal {
    --bs-modal-bg: var(--t-panel);
    --bs-modal-color: var(--t-texto);
    --bs-modal-border-color: var(--t-borde-fuerte);
    --bs-modal-border-width: 1px;
    --bs-modal-border-radius: var(--mod-radio-grande);
    --bs-modal-inner-border-radius: calc(var(--mod-radio-grande) - 1px);
    --bs-modal-header-border-color: var(--t-borde);
    --bs-modal-footer-border-color: var(--t-borde);
    --bs-modal-header-padding: 14px 24px;
    --bs-modal-padding: 20px 24px;
    --bs-modal-footer-gap: 8px;
    --bs-modal-footer-bg: var(--t-cabecera);
    --bs-modal-box-shadow: var(--t-sombra-modal);
}
[data-piel="moderna"] .modal-content { border: 1px solid var(--t-borde-fuerte); border-top: 4px solid var(--mod-acento); background: var(--t-panel); color: var(--t-texto); box-shadow: var(--bs-modal-box-shadow); }
[data-piel="moderna"] .modal-header { background: var(--t-cabecera); }
[data-piel="moderna"] .modal-title { font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--t-texto-fuerte); }
[data-piel="moderna"] .modal-footer { padding: 12px 24px; background: var(--t-cabecera); }
[data-piel="moderna"] .modal-backdrop { --bs-backdrop-bg: var(--t-backdrop); --bs-backdrop-opacity: var(--t-backdrop-opacidad); }
[data-piel="moderna"] #modal-ficha .modal-header .btn {
    width: 32px;
    height: 32px;
    min-height: 0;
    padding: 0;
    border-radius: var(--mod-radio);
    --bs-btn-border-color: var(--t-borde-fuerte);
    --bs-btn-hover-border-color: var(--mod-acento);
    --bs-btn-border-width: 1px;
    background: transparent;
    border: 1px solid var(--t-borde-fuerte);
    color: var(--t-texto-2);
}
[data-piel="moderna"] #modal-ficha .modal-header .btn:hover { background: var(--mod-acento); border-color: var(--mod-acento); color: var(--mod-acento-texto); }
[data-piel="moderna"] .modal-header .btn-close { margin-left: 4px; }
[data-piel="moderna"] #modal-abm-error, [data-piel="moderna"] #modal-nv-error { color: var(--t-rojo-texto) !important; font-weight: 500; }

/* Wizard (expediente y norma): pasos con número en círculo, línea ámbar bajo el activo */
[data-piel="moderna"] .wizard-pasos { margin-bottom: 18px; padding-bottom: 0; gap: 2px; border-bottom: 1px solid var(--t-borde); }
[data-piel="moderna"] .wizard-pasos .nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 10px 10px;
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    margin-bottom: -1px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--t-texto-3);
    background: transparent;
    transition: color .15s ease, border-color .15s ease;
}
[data-piel="moderna"] .wizard-pasos .nav-link:hover { color: var(--t-texto-fuerte); background: transparent; }
[data-piel="moderna"] .wizard-pasos .nav-link .numero {
    width: 24px;
    height: 24px;
    margin-right: 0;
    border: 2px solid var(--t-borde-fuerte);
    background: var(--t-fondo);
    color: var(--t-texto-2);
    font-size: 12px;
    font-weight: 700;
    flex: 0 0 auto;
}
[data-piel="moderna"] .wizard-pasos .nav-link.active { background: transparent; color: var(--t-texto-fuerte); border-bottom-color: var(--mod-acento); }
[data-piel="moderna"] .wizard-pasos .nav-link.active .numero, [data-piel="moderna"] .wizard-pasos .nav-link.hecho .numero { background: var(--mod-acento); border-color: var(--mod-acento); color: var(--mod-acento-texto); }
[data-piel="moderna"] .wizard-pasos .nav-link.hecho { color: var(--t-texto-2); }
[data-piel="moderna"] .wizard-pasos .nav-link.con-error { color: var(--t-rojo-texto); }
[data-piel="moderna"] .wizard-pasos .nav-link.con-error .numero { background: var(--mod-rojo-fondo); border-color: var(--mod-rojo-fondo); color: #FFFFFF; }
[data-piel="moderna"] .wizard-botones { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--t-borde); }
[data-piel="moderna"] .fragmento-modal .alert { margin-bottom: 14px; }
[data-piel="moderna"] .fragmento-modal h5 { font-size: 14px; }
[data-piel="moderna"] .fragmento-modal dl dt { color: var(--t-texto-3); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }

/* ---------- Panel de administración: tarjetas oscuras con número grande y línea ámbar ---------- */
[data-piel="moderna"] .panel-tarjetas { row-gap: 18px; }
[data-piel="moderna"] .profile_view {
    padding: 16px 16px 14px;
    border: 1px solid var(--t-borde);
    border-top: 3px solid var(--mod-acento);
    border-radius: var(--mod-radio-grande);
    background: var(--t-fondo);
    box-shadow: none;
}
[data-piel="moderna"] .profile_view .brief { margin: 0 0 10px; font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--t-texto-3); }
[data-piel="moderna"] .profile_view .count { font-size: 34px; font-weight: 700; letter-spacing: -.01em; color: var(--t-texto-fuerte); }
[data-piel="moderna"] .profile_view .icon { font-size: 30px; color: var(--t-acento-fg); opacity: .85; }
[data-piel="moderna"] .profile_view .profile-bottom { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--t-borde); }
[data-piel="moderna"] .profile_view .btn { min-height: 30px; }
[data-piel="moderna"] .profile_view .btn small { font-size: 9px; letter-spacing: 0; text-transform: none; }

/* ---------- Estadísticas (los colores de Chart.js salen de window.SIL_PIEL, assets/app.js) ---------- */
[data-piel="moderna"] #panel-graficos canvas { background: transparent; }
[data-piel="moderna"] #panel-graficos h6 { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--t-texto-3); }
[data-piel="moderna"] #form-estadisticas .form-check-inline { margin-right: 6px; }

/* ---------- Visor PDF integrado ---------- */
[data-piel="moderna"] .panel-visor .x_content { padding: 0; }
[data-piel="moderna"] .panel-visor .x_title { margin-bottom: 0; }
[data-piel="moderna"] .visor-barra { padding: 8px 12px; gap: 6px 14px; background: var(--t-cabecera); border-bottom: 2px solid var(--t-borde); }
[data-piel="moderna"] .visor-barra .btn { min-height: 30px; }
[data-piel="moderna"] .visor-barra .btn .bi { color: var(--t-acento-fg); }
[data-piel="moderna"] .visor-barra .btn:hover .bi { color: inherit; }
[data-piel="moderna"] .visor-barra select { padding-right: 1.8rem; }
/* Solo el contador «1 / N» de la barra: `.visor-pagina` es también cada página del documento. */
[data-piel="moderna"] .visor-barra .visor-pagina span { color: var(--t-texto-3); font-size: 13px; }
[data-piel="moderna"] .visor-coincidencias { color: var(--t-texto-3); }
[data-piel="moderna"] .visor-estado { padding: 14px; color: var(--t-texto-3); }
[data-piel="moderna"] .visor-paginas { background: var(--t-visor-fondo); padding: 16px; }
[data-piel="moderna"] .visor-paginas .visor-pagina { box-shadow: var(--t-sombra-pagina); }
[data-piel="moderna"] .visor-paginas:focus-visible { outline: 2px solid var(--t-acento-fg); outline-offset: -2px; }
[data-piel="moderna"] .textLayer ::selection { background: rgba(245, 158, 11, .35); }
[data-piel="moderna"] .textLayer .visor-resaltado { background: rgba(245, 158, 11, .55); }
/* La capa de texto del PDF (para seleccionar y buscar) va SIEMPRE invisible encima del dibujo:
   si toma color se ve el texto «doble» o borroneado. Nada de la piel la puede pintar. */
[data-piel="moderna"] .textLayer, [data-piel="moderna"] .textLayer :is(span, br) { color: transparent !important; -webkit-text-fill-color: transparent !important; text-shadow: none !important; }
[data-piel="moderna"] .visor-pdf { height: calc(100vh - 160px); }

/* ---------- Pie ---------- */
[data-piel="moderna"] .piedepagina {
    padding: 10px 24px;
    border-top: 1px solid var(--t-borde);
    background: var(--t-cabecera);
    color: var(--t-texto-3);
    font-size: 13px;
}
[data-piel="moderna"] .piedepagina .redes-sociales a { font-size: 18px; color: var(--t-texto-3); opacity: 1; }
[data-piel="moderna"] .piedepagina .redes-sociales a:hover { color: var(--t-acento-fg); }
[data-piel="moderna"] .piedepagina .info-hcm a { color: var(--t-acento-fg); text-decoration: none; }
[data-piel="moderna"] .piedepagina .info-hcm a:hover { text-decoration: underline; }

/* ---------- Login: tarjeta del tono (oscura en Oscuro/Medio, blanca en Claro) con línea ámbar arriba sobre un degradé marino ---------- */
[data-piel="moderna"] .pagina-login,
[data-piel="moderna"][data-bs-theme="dark"] .pagina-login {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 24px 16px;
    font-family: var(--bs-body-font-family);
    color: var(--t-texto);
    background: var(--t-login-fondo);
}
[data-piel="moderna"] .login-contenedor { width: 100%; padding-top: 0; }
[data-piel="moderna"] .login-panel,
[data-piel="moderna"] .login-panel.login-panel {
    width: 100%;
    max-width: 400px;
    min-width: 0;
    border: 1px solid var(--t-borde-fuerte);
    border-top: 4px solid var(--mod-acento);
    border-radius: var(--mod-radio-grande);
    background: var(--t-panel);
    box-shadow: var(--t-login-sombra);
    color: var(--t-texto);
}
[data-piel="moderna"] .login-marca { padding: 28px 28px 0; text-align: center; }
[data-piel="moderna"] .login-logo { height: 72px; width: auto; border-radius: 50%; }
[data-piel="moderna"] .login-cabecera {
    padding: 12px 0 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--t-texto-3);
}
[data-piel="moderna"] .login-cuerpo { padding: 8px 28px 28px; }
[data-piel="moderna"] .login-titulo { margin: 10px 0 20px; font-size: 15px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; text-align: center; color: var(--t-texto-fuerte); }
[data-piel="moderna"] .login-cuerpo .form-label { display: block; margin-bottom: 4px; text-align: left; }
[data-piel="moderna"] .login-cuerpo .form-label.mt-2 { margin-top: 16px !important; }
[data-piel="moderna"] .login-cuerpo .form-control { min-height: 42px; padding: 9px 10px; font-size: 15px; }
[data-piel="moderna"] .login-recordarme { justify-content: flex-start; gap: 8px; margin: 16px 0 4px; padding-left: 0; font-size: 14px; color: var(--t-texto); }
[data-piel="moderna"] .login-recordarme .form-check-input { margin: .2em 0 0; float: none; }
[data-piel="moderna"] .login-olvido { margin-bottom: 18px; text-align: left; font-size: 13px; }
[data-piel="moderna"] .login-olvido a { color: var(--t-acento-fg); }
[data-piel="moderna"] .login-botones { flex-direction: column; gap: 6px; }
[data-piel="moderna"] .login-botones .btn { padding: 8px 16px; font-size: 13px; min-height: 44px; }
[data-piel="moderna"] .login-volver { color: var(--t-texto-3); font-weight: 600; }
[data-piel="moderna"] .login-volver:hover { color: var(--t-texto-fuerte); }
[data-piel="moderna"] .login-cuerpo .alert { margin-bottom: 14px; }

/* ---------- Celular ---------- */
@media (max-width: 767.98px) {
    [data-piel="moderna"] .left_col { box-shadow: 8px 0 32px rgba(0, 0, 0, .6); border-right: 1px solid var(--t-barra-borde); }
    [data-piel="moderna"] .nav_menu { padding: 0 12px; gap: 8px; }
    [data-piel="moderna"] .right_col { padding: 12px 12px 20px; }
    [data-piel="moderna"] .x_title { padding: 10px 14px; }
    [data-piel="moderna"] .x_content { padding: 0 14px; }
    [data-piel="moderna"] #bloque-buscar { right: 8px; }
    [data-piel="moderna"] .contenedor-bloque-buscar { flex-wrap: wrap; }
    [data-piel="moderna"] .contenedor-bloque-buscar input[type="text"] { flex-basis: 100%; }
    [data-piel="moderna"] .usuario-menu { padding-right: 4px; }
    [data-piel="moderna"] body.nav-sm .side-menu li a { justify-content: flex-start; padding: 10px 16px 10px 17px; border-left: 3px solid transparent; }
    [data-piel="moderna"] body.nav-sm .side-menu li.current-page > a { border-left-color: var(--mod-acento); box-shadow: none; }
    [data-piel="moderna"] body.nav-sm .side-menu li a .badge { display: inline-block; }
    [data-piel="moderna"] .login-cuerpo { padding: 8px 20px 22px; }
    [data-piel="moderna"] .login-marca { padding: 22px 20px 0; }
    [data-piel="moderna"] .wizard-pasos .nav-link { padding: 6px 6px 8px; font-size: 10px; }
    [data-piel="moderna"] .wizard-pasos .nav-link .numero { width: 20px; height: 20px; font-size: 11px; }
}

/* ---------- Impresión: fondo blanco y texto negro (fichas, listados, estadísticas) ---------- */
@media print {
    [data-piel="moderna"], [data-piel="moderna"][data-tono="medio"], [data-piel="moderna"][data-tono="claro"] {
        color-scheme: light;
        --t-elevado: #E5E7EB;
        --t-cabecera-hover: #F3F4F6;
        --t-acento-fg: #000000;
        --t-acento-fg-hover: #000000;
        --t-vencida-texto: #000000;
        --t-hover: transparent;
        --t-fondo: #FFFFFF;
        --t-panel: #FFFFFF;
        --t-cabecera: #F3F4F6;
        --t-borde: #D1D5DB;
        --t-borde-fuerte: #9CA3AF;
        --t-texto: #000000;
        --t-texto-fuerte: #000000;
        --t-texto-campo: #000000;
        --t-texto-2: #111827;
        --t-texto-3: #374151;
        --t-texto-apagado: #6B7280;
        --t-cabecera-texto: #000000;
        --t-campo: #FFFFFF;
        --t-campo-foco: #FFFFFF;
        --t-acento-claro: #92400E;
        --t-verde-texto: #166534;
        --t-rojo-texto: #991B1B;
        --t-zebra: #F9FAFB;
        --t-hover: transparent;
        --bs-body-bg: #FFFFFF;
        --bs-body-color: #000000;
        --sil-fondo: #FFFFFF;
        --sil-panel: #FFFFFF;
        --sil-texto: #000000;
        --sil-texto-fuerte: #000000;
    }
    [data-piel="moderna"] body, [data-piel="moderna"] .right_col, [data-piel="moderna"] .x_panel, [data-piel="moderna"] .modal-content { background: #FFFFFF !important; color: #000000 !important; }
    [data-piel="moderna"] .x_panel { border: 0; border-left: 5px solid #9CA3AF; box-shadow: none; }
    [data-piel="moderna"] .x_title { background: #FFFFFF; }
    [data-piel="moderna"] .x_title h2::before { display: none; }
    [data-piel="moderna"] .ficha-seccion, [data-piel="moderna"] .ficha-cabecera, [data-piel="moderna"] .profile_view { border-color: #9CA3AF; box-shadow: none; }
    [data-piel="moderna"] .ficha-seccion-titulo { background: #F3F4F6 !important; color: #000000 !important; }
    [data-piel="moderna"] .table thead th, [data-piel="moderna"] table.dataTable thead > tr > th { background: #F3F4F6 !important; color: #000000; border-bottom-color: #000000 !important; }
    [data-piel="moderna"] .table > :not(caption) > * > * { color: #000000; }
    [data-piel="moderna"] a, [data-piel="moderna"] .link-siem a, [data-piel="moderna"] .link-download-doc a { color: #000000; }
    [data-piel="moderna"] .ficha .ficha-enlace.btn { background: transparent; color: #000000; border-color: #9CA3AF; }
    [data-piel="moderna"] .vencimientos tr.vencida > * { background-color: #FEE2E2; color: #000000; }
    [data-piel="moderna"] .vencimientos tr.urgente > * { background-color: #FEF3C7; color: #000000; }
    [data-piel="moderna"] .fragmento-texto mark { background: #FDE68A; color: #000000; }
    [data-piel="moderna"] .badge { border: 1px solid #9CA3AF; color: #000000 !important; background: transparent !important; }
    [data-piel="moderna"] .visor-paginas { background: #FFFFFF; }
}