@layer app-fundaciones, app-legado, app-privado, app-soporte;

@layer app-fundaciones {
html { margin: 0; padding: 0; box-sizing: border-box; -webkit-touch-callout: none; user-select: none; cursor: default; overscroll-behavior-y: contain; /* Disables pull-to-refresh but allows overscroll glow effects (https://developers.google.com/web/updates/2017/11/overscroll-behavior) */ }
body { margin: 0; padding: 0; width: 100vw; height: 100vh; overflow-x: hidden; font-size: .875rem; font-family: Roboto, "Helvetica Neue", Helvetica, sans-serif; -webkit-font-smoothing: antialiased; }
*, *:before, *:after { box-sizing: inherit; }

#blazor-error-ui { background: lightyellow; bottom: 0; box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2); display: none; left: 0; padding: 0.6rem 1.25rem 0.7rem 1.25rem; position: fixed; width: 100%; z-index: 1000; }
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 0.75rem; top: 0.5rem; }
.blazor-error-boundary { background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121; padding: 1rem 1rem 1rem 3.7rem; color: white; }
.blazor-error-boundary::after { content: "An error has occurred." }
.validation-message { color: red; font-style: italic; }

/* FUENTES Roboto (wwwroot/fonts) */
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 100; src: url('/fonts/Roboto-Thin.woff2') format('woff2'), url('/fonts/Roboto-Thin.woff') format('woff'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 300; src: url('/fonts/Roboto-Light.woff2') format('woff2'), url('/fonts/Roboto-Light.woff') format('woff'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 400; src: url('/fonts/Roboto-Regular.woff2') format('woff2'), url('/fonts/Roboto-Regular.woff') format('woff'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 500; src: url('/fonts/Roboto-Medium.woff2') format('woff2'), url('/fonts/Roboto-Medium.woff') format('woff'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 700; src: url('/fonts/Roboto-Bold.woff2') format('woff2'), url('/fonts/Roboto-Bold.woff') format('woff'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 900; src: url('/fonts/Roboto-Black.woff2') format('woff2'), url('/fonts/Roboto-Black.woff') format('woff'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 100; src: url('/fonts/Roboto-ThinItalic.woff2') format('woff2'), url('/fonts/Roboto-ThinItalic.woff') format('woff'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 300; src: url('/fonts/Roboto-LightItalic.woff2') format('woff2'), url('/fonts/Roboto-LightItalic.woff') format('woff'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 400; src: url('/fonts/Roboto-Italic.woff2') format('woff2'), url('/fonts/Roboto-Italic.woff') format('woff'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 500; src: url('/fonts/Roboto-MediumItalic.woff2') format('woff2'), url('/fonts/Roboto-MediumItalic.woff') format('woff'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 700; src: url('/fonts/Roboto-BoldItalic.woff2') format('woff2'), url('/fonts/Roboto-BoldItalic.woff') format('woff'); }
@font-face { font-family: 'Roboto'; font-style: italic; font-weight: 900; src: url('/fonts/Roboto-BlackItalic.woff2') format('woff2'), url('/fonts/Roboto-BlackItalic.woff') format('woff'); }
}

@layer app-legado {

div.asa { cursor: grab; content: '....'; width: 1.625rem; min-width: 1.625rem; height: 1.5rem; display: inline-block; overflow: hidden; line-height: .3125rem; padding: .1925rem .25rem; vertical-align: middle; margin-top: -.7rem; margin-right: .3rem; font-size: .75rem; font-family: sans-serif; letter-spacing: .125rem; color: hsl(var(--fondo-neutro)); text-shadow: .0675rem 0 .0675rem hsl(var(--frente-neutro)); }
    div.asa::after { content: '.. .. .. ..'; }

.e-tab { height: calc(100% - 8px) !important; } /* Hace que el contenido de los Tabs sea desbordable */

/* COLORES */
/* :root { --hsl-red: 0; --hsl-yellow: 60; --hsl-green: 120; --hsl-cyan: 180; --hsl-blue: 240; --hsl-magenta: 300; } */
:root {
    --hs-fondo-primario: 205 57%;
    --fondo-primario: 205 57% 31%;
    --frente-primario: 0 100% 100%;
    --hs-fondo-secundario: 175 39%;
    --fondo-secundario: 175 39% 70%;
    --frente-secundario: 0 100% 100%;
    --hs-fondo-terciario: 52 65%;
    --fondo-terciario: 52 65% 89%;
    --frente-terciario: 205 57% 31%;
    --hs-fondo-neutro: 0 0%;
    --fondo-neutro: 0 0% 97%;
    --frente-neutro: 0 0% 10%;
    --frente-resaltado: 33 100% 50%;
    --frente-error: 0 100% 50%;
    --borde-neutro: 0 0% 50%;
    --primario-b5: #0d6efd;
}

.mensaje-error { color: hsl(var(--frente-error)) !important; }
.mensaje-advertencia { color: hsl(var(--frente-resaltado)) !important; }
.mensaje-exito { color: darkgreen !important; }
.e-dialog .e-dlg-header-content { background-color: hsl(var(--fondo-neutro)); } /* Cabeceras de los diálogos */
/*.e-btn { background-color: hsl(var(--fondo-primario)); }
    .e-btn:enabled:hover, .e-btn:enabled:focus, .e-btn:enabled:active, .e-dropdown-btn.e-active, .e-dropdown-btn:enabled:focus { background-color: hsl(var(--hs-fondo-primario) 40%); }
    .e-btn:enabled:focus { box-shadow: 0 0 0 4px hsl(var(--hs-fondo-primario) 50% / 0.3); }*/
.e-btn.boton-transparente { background-color: transparent !important; border: none !important; }
.e-btn.boton-transparente:hover { background-color: rgba(0,0,0,0.2) !important; }
.e-reset.e-icons.e-rating-reset { margin: -4px 10px 0 10px; } /* Ajuste fino del icono de reset del componente Rating */

/* LAYOUT GENERAL */
#ContenedorVentanaCompleta { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; box-sizing: border-box; z-index: 999; margin: 0; padding: 32px; background: url(/images/portada.jpg) no-repeat; background-size: cover; background-color: hsl(var(--fondo-neutro)); color: hsl(var(--frente-neutro)); }
#MenuPpal { background-image: linear-gradient(to right, hsl(var(--hs-fondo-primario) 50% / 0.2), hsl(var(--hs-fondo-primario) 50% / 0.05)); /* overflow-x: hidden; Esto (junto al Width fijo) permite que el componente MenuPpal fije la anchura para dejar oculta la barra de scroll vertical */ }
    #MenuPpal #infoUsuario:hover { border: 2px solid darkgray; }
    #MenuPpal .enlace { display: block; padding: 1rem; text-decoration: none; color: black; }
    #MenuPpal .e-accordion, #MenuPpal .e-acrdn-item, #MenuPpal .e-menu-container { background-color: transparent; }
    #MenuPpal .e-acrdn-header:focus { box-shadow: none !important; }
    #MenuPpal .e-acrdn-content { padding: 0 }
    #MenuPpal .e-menu-container, #MenuPpal .e-menu { width: 100%; }
    #MenuPpal .e-menu-item { padding-left: 1.5rem; font-weight: 300; }
#ContenedorPpal { display: grid; grid-template-rows: min-content minmax(0, 1fr) min-content; height: 100vh; width: 100%; overflow: hidden; position: relative; }
#CabeceraPaginas { display: flex; flex-direction: row; align-content: center; justify-content: space-between; align-items: center; min-height: 3rem; background-color: var(--publico-navy, #0d325e); color: hsl(var(--frente-primario)); }
    #CabeceraPaginas > .e-btn, #CabeceraPaginas > .e-btn:focus, #CabeceraPaginas > .e-btn:active { padding: .5rem; border: none; outline: none; box-shadow: none; }
#ContenidoPpal { overflow: auto; }


#PanelConfigVista { background-image: linear-gradient(to left, hsl(var(--hs-fondo-primario) 50% / 0.2), hsl(var(--hs-fondo-primario) 50% / 0.05)); border-left: 1px solid hsl(var(--frente-neutro) / 0); }
    #PanelConfigVista .e-dropdown-btn.boton-seccion { line-height: 1.75rem; width: 100%; border-radius: 0; border: none; background-color: transparent; background-image: linear-gradient(to right, hsl(var(--hs-fondo-primario) 50% / 0.2), hsl(var(--hs-fondo-primario) 50% / 0.05)); color: hsl(var(--frente-terciario)); }
    #PanelConfigVista .e-accordion { border-radius: 0; border: none; background-color: transparent; }
        #PanelConfigVista .e-accordion .e-acrdn-item { background-color: transparent; }
            #PanelConfigVista .e-accordion .e-acrdn-item .e-acrdn-header { text-align: center; background-color: transparent; background-image: linear-gradient(to right, hsl(var(--hs-fondo-primario) 50% / 0.2), hsl(var(--hs-fondo-primario) 50% / 0.05)); }
                #PanelConfigVista .e-accordion .e-acrdn-item .e-acrdn-header .e-acrdn-header-content { color: hsl(var(--frente-terciario)); }

    #PanelConfigVista .encabezado-seccion { color: hsl(var(--fondo-primario)); border-bottom: 1px solid hsl(var(--borde-neutro) / 0.25); }

.e-dialog { min-width: 22rem !important; } /* Ancho mínimo de los dialogos con ancho porcentual */

.oferta, .dlg-oferta .e-dlg-header-content { background-color: rgb(245,255,245) !important; }
.pedido, .dlg-pedido .e-dlg-header-content { background-color: rgb(255,245,245) !important; }
.albaran-venta, .dlg-albaran-venta .e-dlg-header-content { background-color: rgb(245,245,255) !important; }

.capsula { display: inline-block; padding: 0.25rem; border-radius: 0.25rem; border: 1px solid hsl(var(--borde-neutro) / 0.5); }

/* LAYOUT */
.peso-fuente-extrafino { font-weight: 100 !important; }
.peso-fuente-liviano { font-weight: 300 !important; }
.peso-fuente-regular { font-weight: 400 !important; }
.peso-fuente-extra-negro { font-weight: 900 !important; }


/* ICONOS */
.e-icons { font-size: 1rem; }


/* Cabecera sitio público y marco: ver wwwroot/css/publico.css (@layer publico-marco). */

/* Tarjeta de sección de formulario */
.seccion-form {
    border: 1px solid hsl(var(--borde-neutro) / .25);
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    margin-top: 0.75rem;
    max-width: 50rem;
    background: hsl(var(--fondo-neutro));
    box-shadow: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.06);
}
.seccion-form__titulo {
    font-weight: 600;
    font-size: 1rem;
    margin: 0 0 0.75rem;
    color: hsl(var(--fondo-primario));
}

/* Campos escalares dentro de sección — fluyen en fila con wrap */
.seccion-form__campos {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.25rem;
}

/* Grid compacto para campos booleanos (checkboxes) */
.cuadricula-comprobaciones {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
    gap: 0.35rem 1.25rem;
    margin-top: 0.5rem;
}
.cuadricula-comprobaciones label {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.875rem;
    cursor: pointer;
}

/* Anchos adaptativos por tipo de dato */
.campo-texto   { min-width: 16rem; flex: 1; max-width: 36rem; }
.campo-numero  { width: 10rem; }
.campo-fecha   { width: 11rem; }
.campo-select  { min-width: 12rem; max-width: 24rem; }
.panel-seccion,
.zona-peligro { margin: 1.5rem 0; padding: 1rem; border: 1px solid hsl(var(--borde-neutro) / 0.35); border-radius: 0.35rem; max-width: 52rem; }
.zona-peligro { border-color: rgba(180, 40, 40, 0.45); }
.salida-url-revision { word-break: break-all; font-size: 0.8rem; }
.alinear-final { align-self: flex-end; }
.cuadricula-indicadores-admin { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: 0.75rem; margin: 1rem 0 1.25rem; max-width: 52rem; }
.tarjeta-indicador-admin { border: 1px solid hsl(var(--borde-neutro) / 0.3); border-radius: 0.4rem; padding: 0.85rem; background: white; }
.tarjeta-indicador-admin h2 { margin: 0; font-size: 0.875rem; color: hsl(var(--fondo-primario)); }
.tarjeta-indicador-admin .indicador-cifra { margin: 0.3rem 0 0; font-size: 1.9rem; font-weight: 700; line-height: 1.1; }
.tarjeta-indicador-admin .indicador-cifra span { font-size: 0.9rem; font-weight: 500; color: #666; }
.campanyas-admin-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1rem; margin: 1rem 0; }
.campanyas-admin-grid article { border: 1px solid hsl(var(--borde-neutro) / 0.25); border-radius: 0.35rem; padding: 0.75rem; background: white; }
.campanyas-admin-grid h3 { margin-top: 0; font-size: 0.95rem; color: hsl(var(--fondo-primario)); }
.campanyas-admin-referer { max-width: 18rem; word-break: break-word; }

/* CalendarioSol (paridad CalendarioUC WPF) */
.cal-sol-root { display: flex; flex-direction: column; height: 100%; min-height: 0; }
.cal-sol-cabecera {
    display: grid; grid-template-columns: repeat(7, 1fr); gap: 0; margin-bottom: 2px;
    font-size: 0.6875rem; font-weight: 600; color: #1a3d5c; text-align: center;
}
.cal-sol-fin-semana { color: #888; }
.cal-sol-rejilla {
    display: grid; grid-template-columns: repeat(7, 1fr); grid-auto-rows: minmax(3.5rem, 1fr);
    flex: 1; min-height: 0; border: 0.5px solid gainsboro;
}
.cal-sol-celda {
    position: relative; border: 0.5px solid gainsboro; padding: 2px; min-height: 3.75rem;
    background: #fff; overflow: hidden;
}
.cal-sol-celda.cal-sol-vacia { background: #f8f8f8; }
.cal-sol-celda.cal-sol-sel { background: rgba(0, 100, 200, 0.12); }
.cal-sol-num-fondo {
    position: absolute; right: 2px; bottom: -2px; font-size: 2.25rem; font-weight: 500;
    color: navy; opacity: 0.05; pointer-events: none; line-height: 1;
}
.cal-sol-cont { position: relative; z-index: 1; display: flex; flex-direction: column; height: 100%; margin-top: 1px; }
.cal-sol-lineas { flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; gap: 0; }
.cal-sol-item {
    display: block; width: 100%; text-align: left; border: none; background: transparent;
    padding: 0 0 0 2px; margin: 0 0 1px 0; cursor: pointer; font-size: 0.6875rem; font-family: inherit;
}
.cal-sol-item:hover { background: rgba(0, 0, 0, 0.04); }
.cal-sol-tit { font-weight: 600; }
.cal-sol-det { font-style: italic; color: #666; }
.cal-sol-item.cal-sol-hecho .cal-sol-tit,
.cal-sol-item.cal-sol-hecho .cal-sol-det { text-decoration: line-through; text-decoration-color: rgba(56, 27, 94, 0.13); }
.cal-sol-extra { font-size: 0.625rem; color: #666; font-style: italic; margin-top: 2px; }

/* Planificación / Agenda — barra de herramientas del calendario */
.barra-calendario-herramientas { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; padding: 0.35rem 0.5rem; background: hsl(var(--fondo-neutro)); border-bottom: 1px solid hsl(var(--borde-neutro) / 0.35); }
.barra-calendario-herramientas .separador-vertical { width: 1px; height: 1.25rem; background: hsl(var(--borde-neutro) / 0.4); margin: 0 0.25rem; }
.panel-dia-detalle { border-top: 1px solid gainsboro; max-height: 11rem; overflow: auto; padding: 0.35rem 0.5rem; }
.panel-dia-detalle .fila-detalle { font-size: 0.6875rem; padding: 0.15rem 0; cursor: pointer; }
.panel-dia-detalle .fila-detalle:hover { text-decoration: underline; }
.menu-contexto-fondo { position: fixed; inset: 0; z-index: 11990; background: transparent; }
.menu-contexto-flotante {
    position: fixed; z-index: 12000; min-width: 10rem; background: #fff; border: 1px solid #ccc;
    box-shadow: 0 2px 8px rgba(0,0,0,0.12); border-radius: 4px; padding: 0.25rem 0;
}
.menu-contexto-flotante button {
    display: block; width: 100%; text-align: left; padding: 0.35rem 0.75rem; border: none; background: none; cursor: pointer; font-size: 0.8125rem;
}
.menu-contexto-flotante button:hover { background: #f0f0f0; }

/* Grupo tareas diálogo — rejilla de meses */
.grupo-anio-nav { display: flex; align-items: center; gap: 0.35rem; margin: 0.5rem 0; }
.grupo-meses { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; max-height: 55vh; overflow: auto; }
.grupo-mes { border: 1px solid hsl(var(--borde-neutro) / 0.35); border-radius: 4px; padding: 4px; }
.grupo-mes-tit { font-size: 0.6875rem; font-weight: 600; color: #1a3d5c; margin-bottom: 4px; text-transform: capitalize; }
.grupo-dias-cab { display: grid; grid-template-columns: repeat(7, 1fr); font-size: 0.5625rem; color: #888; text-align: center; margin-bottom: 2px; }
.grupo-dias-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; }
.grupo-dia-celda { min-height: 1.35rem; }
.grupo-dia-btn {
    width: 100%; min-height: 1.35rem; font-size: 0.625rem; padding: 0; border: 1px solid #ddd; background: #fafafa; cursor: pointer; border-radius: 2px;
}
.grupo-dia-btn.grupo-dia-on { background: hsl(var(--hs-fondo-primario) 45% / 0.35); font-weight: 600; }
.grupo-panel-izq { max-width: 16rem; padding-right: 0.75rem; }
.grupo-layout { display: flex; gap: 0.75rem; flex-wrap: nowrap; min-height: 0; }
@media (max-width: 800px) { .grupo-layout { flex-direction: column; } .grupo-meses { max-height: none; } }

} /* @layer app-legado */

@layer app-privado {
    #MenuPpal {
        background:
            radial-gradient(circle at top left, hsl(var(--hs-fondo-primario) 40% / 0.18), transparent 45%),
            hsl(var(--fondo-neutro));
    }

    #MenuPpal .menu-marca {
        display: flex;
        justify-content: center;
        padding: 1rem 0.9rem 0.7rem;
    }

    #MenuPpal .menu-marca-logo {
        display: block;
        width: min(10.5rem, 82%);
        height: auto;
    }

    #MenuPpal .menu-usuario {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 0.75rem;
        padding: 0.65rem 1rem;
        border-top: 1px solid hsl(var(--borde-neutro) / 0.18);
        border-bottom: 1px solid hsl(var(--borde-neutro) / 0.18);
        color: hsl(var(--fondo-primario));
        font-weight: 700;
        text-align: right;
    }

    #MenuPpal .menu-usuario-nombre {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    #MenuPpal .menu-usuario-salir {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        flex: 0 0 auto;
        color: inherit;
        font-size: 0.8125rem;
        font-weight: 600;
        text-decoration: none;
    }

    #MenuPpal .menu-usuario-salir:hover {
        text-decoration: underline;
    }

    #MenuPpal .menu-lateral-grupo {
        padding: 0.85rem 1rem 0.35rem;
        font-size: 0.72rem;
        text-transform: uppercase;
        letter-spacing: 0.08em;
        color: hsl(var(--fondo-primario) / 0.72);
        font-weight: 800;
    }

    #MenuPpal .menu-lateral-enlace {
        display: flex;
        align-items: center;
        gap: 0.65rem;
        margin: 0.1rem 0.55rem;
        padding: 0.72rem 0.75rem;
        border-radius: 0 0.25rem 0.25rem 0;
        text-decoration: none;
        color: hsl(var(--frente-neutro));
        border-left: 3px solid transparent;
    }

    #MenuPpal .menu-lateral-enlace:hover {
        background-color: hsl(var(--hs-fondo-primario) 30% / 0.08);
    }

    #MenuPpal .menu-lateral-enlace.active {
        border-left-color: hsl(var(--frente-resaltado));
        background-color: hsl(var(--hs-fondo-primario) 40% / 0.14);
        color: hsl(var(--fondo-primario));
        font-weight: 700;
    }

    .menu-lateral-icono {
        width: 1.15rem;
        height: 1.15rem;
        flex: 0 0 1.15rem;
        fill: currentColor;
    }

    .titulo-cabecera,
    .panel-presupuesto-detalle,
    .panel-dialogo-desplazable {
        flex: 1 1 0;
        min-width: 0;
    }

    .boton-cabecera,
    .boton-menu-principal {
        margin-inline: 0.5rem;
    }

    .cabecera-privada-nexus {
        position: relative;
        display: flex;
        align-items: center;
        gap: 0.75rem;
        width: 100%;
        min-width: 0;
    }

    .cabecera-privada-metrica {
        padding: 0.15rem 0.45rem;
        border-left: 1px solid rgba(255, 255, 255, 0.22);
        color: rgba(255, 255, 255, 0.84);
        font-size: 0.75rem;
        font-style: italic;
        line-height: 1.1;
        white-space: nowrap;
    }

    .cabecera-privada-acciones {
        position: relative;
        display: flex;
        align-items: center;
        gap: 0.25rem;
        margin-left: auto;
    }

    .boton-icono-cabecera {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 2.25rem;
        height: 2.25rem;
        border: 0;
        border-radius: 0.2rem;
        background: transparent;
        color: inherit;
        font: inherit;
        font-size: 1.35rem;
        line-height: 1;
        cursor: pointer;
    }

    .boton-icono-cabecera:hover,
    .boton-icono-cabecera[aria-pressed="true"] {
        background: rgba(255, 255, 255, 0.12);
    }

    .boton-panel-derecho {
        font-size: 1rem;
    }

    .menu-acciones-cabecera {
        position: absolute;
        top: calc(100% + 0.4rem);
        right: 2.5rem;
        z-index: 1200;
        min-width: 11rem;
        padding: 0.25rem 0;
        border: 1px solid rgba(13, 50, 94, 0.16);
        border-radius: 0.25rem;
        background: white;
        color: hsl(var(--frente-neutro));
        box-shadow: 0 0.6rem 1.5rem rgba(0, 0, 0, 0.18);
    }

    .menu-acciones-cabecera button {
        display: block;
        width: 100%;
        padding: 0.5rem 0.75rem;
        border: 0;
        background: transparent;
        color: inherit;
        font: inherit;
        font-size: 0.875rem;
        text-align: left;
        cursor: pointer;
    }

    .menu-acciones-cabecera button:hover {
        background: hsl(var(--hs-fondo-primario) 30% / 0.08);
    }

    .menu-acciones-cabecera button:disabled {
        color: rgba(0, 0, 0, 0.36);
        cursor: not-allowed;
    }

    .vista-gestion-lista {
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .panel-vista-cabecera {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 0.75rem;
        padding-bottom: 0.7rem;
        border-bottom: 1px solid hsl(var(--borde-neutro) / 0.22);
    }

    .panel-vista-etiqueta {
        display: block;
        color: hsl(var(--fondo-primario) / 0.74);
        font-size: 0.7rem;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .panel-vista-cabecera h2 {
        margin: 0.1rem 0 0;
        color: var(--publico-navy, #0d325e);
        font-size: 1rem;
    }

    .boton-panel-cerrar {
        border: 0;
        background: transparent;
        color: rgba(0, 0, 0, 0.55);
        font: inherit;
        font-size: 1.25rem;
        line-height: 1;
        cursor: pointer;
    }

    .panel-vista-seccion {
        padding: 0.9rem 0;
        border-bottom: 1px solid hsl(var(--borde-neutro) / 0.16);
    }

    .panel-vista-seccion h3 {
        margin: 0 0 0.55rem;
        color: var(--publico-navy, #0d325e);
        font-size: 0.82rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .panel-vista-resumen {
        display: grid;
        gap: 0.25rem;
        color: rgba(0, 0, 0, 0.66);
        font-size: 0.875rem;
    }

    .panel-vista-resumen strong {
        color: hsl(var(--frente-neutro));
    }

    .boton-panel-secundario {
        margin-top: 0.75rem;
        padding: 0.45rem 0.7rem;
        border: 1px solid rgba(13, 50, 94, 0.22);
        border-radius: 0.25rem;
        background: transparent;
        color: var(--publico-navy, #0d325e);
        font: inherit;
        font-size: 0.8125rem;
        font-weight: 700;
        cursor: pointer;
    }

    .boton-panel-secundario:hover {
        background: rgba(13, 50, 94, 0.06);
    }

    .texto-nota { font-size: 0.875rem; }
    .texto-mini { font-size: 0.8125rem; }
    .texto-pequeno { font-size: 0.75rem; }
    .texto-destacado {
        max-width: 42rem;
        font-size: 1.05rem;
        line-height: 1.45;
    }
    .texto-secundario { color: rgba(0, 0, 0, 0.62); }
    .texto-con-margen-suave { margin-top: 0.5rem; }

    .titulo-seccion {
        font-size: 1rem;
        color: hsl(var(--fondo-primario));
    }
    .titulo-sin-margen { margin: 0; }
    .titulo-con-margen { margin-top: 1rem; }
    .titulo-con-margen-suave { margin-top: 0.75rem; }

    .acciones-enlinea,
    .formulario-fila,
    .cabecera-seccion-acciones {
        display: flex;
        flex-wrap: wrap;
    }

    .acciones-enlinea { gap: 0.75rem; }
    .acciones-con-margen { margin-top: 0.75rem; }
    .cabecera-seccion-acciones {
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
    }
    .formulario-fila {
        align-items: flex-end;
        gap: 1rem;
    }
    .formulario-fila-con-margen { margin-top: 1rem; }

    .formulario-apilado,
    .formulario-campo,
    .panel-lateral-contenido,
    .calendario-marco,
    .calendario-contenido {
        display: flex;
        flex-direction: column;
    }

    .formulario-apilado { gap: 1rem; }
    .formulario-campo { gap: 0.25rem; }
    .formulario-campo-expandido { flex: 1 1 0; }
    .formulario-campo-con-margen { margin-top: 0.5rem; }
    .control-formulario { width: 100%; }
    .control-formulario-nota {
        margin-top: 0.25rem;
        font-size: 0.75rem;
    }

    .tabla-datos {
        width: 100%;
        border-collapse: collapse;
        font-size: 0.875rem;
    }
    .tabla-con-margen { margin-top: 0.5rem; }
    .tabla-desplazable,
    .contenido-rejilla-desplazable,
    .panel-dialogo-desplazable {
        overflow: auto;
    }
    .contenido-rejilla-desplazable,
    .panel-lateral-contenido {
        height: 100%;
        min-height: 100%;
    }

    .panel-lateral-contenido {
        padding: 0.75rem;
    }
    .encabezado-seccion-con-margen { margin-bottom: 0.5rem; }

    .bloque-presupuesto,
    .bloque-publico {
        margin: 1.5rem 0;
        max-width: 50rem;
    }
    .boton-con-margen,
    .boton-grupo-con-margen { margin-top: 0.5rem; }
    .boton-grupo-con-margen-suave { margin-top: 0.25rem; }
    .boton-texto-peligro {
        margin-top: 0.5rem;
        color: hsl(var(--frente-error)) !important;
        font-size: 0.75rem;
    }

    .calendario-marco,
    .calendario-contenido {
        height: 100%;
        min-height: 0;
    }
    .calendario-contenido { flex: 1 1 0; }
    .calendario-mes-actual {
        min-width: 10rem;
        color: #1a3d5c;
        font-weight: 700;
        text-align: center;
    }
    .grupo-anio-actual {
        min-width: 3rem;
        font-weight: 700;
        text-align: center;
    }
    .opcion-barra-calendario,
    .grupo-fila-comprobacion {
        display: flex;
        align-items: center;
        gap: 0.35rem;
        margin: 0;
        font-size: 0.875rem;
    }
    .grupo-acciones {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 0.35rem;
        margin-top: 1rem;
    }
    .grupo-etiqueta {
        margin-bottom: 0.25rem;
        color: rgba(0, 0, 0, 0.62);
        font-size: 0.8125rem;
    }
    .grupo-contador {
        margin-left: 0.5rem;
        font-size: 0.875rem;
    }
    .panel-dia-titulo {
        margin-bottom: 0.25rem;
        font-size: 0.8125rem;
        font-weight: 700;
    }
    .menu-contexto-peligro {
        padding: 0.25rem 1rem;
        color: rgba(0, 0, 0, 0.62);
        font-size: 0.75rem;
    }

    .gestion-sol-clientes {
        background:
            linear-gradient(180deg, rgba(13, 50, 94, 0.04), transparent 12rem),
            hsl(var(--fondo-neutro));
    }

    .panel-vista-sol {
        gap: 0.85rem;
    }

    .tabla-sol-marco {
        height: 100%;
        min-height: 0;
        overflow: auto;
        border-top: 1px solid rgba(13, 50, 94, 0.14);
        background: white;
    }

    .tabla-sol {
        width: 100%;
        min-width: 72rem;
        border-collapse: separate;
        border-spacing: 0;
        color: hsl(var(--frente-neutro));
        font-size: 0.875rem;
    }

    .tabla-sol thead {
        position: sticky;
        top: 0;
        z-index: 2;
        background: var(--publico-navy, #0d325e);
        color: white;
    }

    .tabla-sol th,
    .tabla-sol td {
        border-bottom: 1px solid rgba(13, 50, 94, 0.1);
        padding: 0.55rem 0.7rem;
        text-align: left;
        vertical-align: middle;
        white-space: nowrap;
    }

    .tabla-sol th {
        padding: 0;
        font-weight: 700;
    }

    .tabla-sol-cabecera {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        width: 100%;
        min-height: 2.55rem;
        padding: 0.55rem 0.7rem;
        border: 0;
        background: transparent;
        color: inherit;
        font: inherit;
        font-weight: 700;
        cursor: pointer;
    }

    .tabla-sol-cabecera:hover:not(:disabled) {
        background: rgba(255, 255, 255, 0.1);
    }

    .tabla-sol-cabecera:disabled {
        cursor: default;
        opacity: 0.78;
    }

    .tabla-sol-orden {
        min-width: 2.2rem;
        color: rgba(255, 255, 255, 0.78);
        font-size: 0.65rem;
        text-align: right;
    }

    .tabla-sol-fila {
        cursor: pointer;
    }

    .tabla-sol-fila:hover {
        background: rgba(13, 50, 94, 0.05);
    }

    .tabla-sol-fila-seleccionada {
        background: rgba(13, 50, 94, 0.12);
    }

    .tabla-sol-vacia {
        padding: 2rem;
        color: rgba(0, 0, 0, 0.58);
        text-align: center;
    }

    .tabla-sol-estado {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 4.7rem;
        padding: 0.18rem 0.45rem;
        border-radius: 999px;
        font-size: 0.75rem;
        font-weight: 700;
    }

    .tabla-sol-estado-activo {
        background: rgba(19, 126, 67, 0.12);
        color: #137e43;
    }

    .tabla-sol-estado-inactivo {
        background: rgba(121, 121, 121, 0.14);
        color: #595959;
    }

    .paginador-sol,
    .alternador-sol,
    .preajustes-sol {
        display: grid;
        gap: 0.55rem;
    }

    .paginador-sol-botones,
    .paginador-sol-resumen,
    .alternador-sol-modos,
    .alternador-sol-resumen,
    .preajustes-sol-crear,
    .preajustes-sol-item {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.4rem;
    }

    .paginador-sol button,
    .alternador-sol button,
    .preajustes-sol button {
        padding: 0.35rem 0.55rem;
        border: 1px solid rgba(13, 50, 94, 0.22);
        border-radius: 0.25rem;
        background: white;
        color: var(--publico-navy, #0d325e);
        font: inherit;
        font-size: 0.78rem;
        font-weight: 700;
        cursor: pointer;
    }

    .paginador-sol button:disabled,
    .alternador-sol button:disabled {
        opacity: 0.45;
        cursor: not-allowed;
    }

    .paginador-sol-resumen,
    .alternador-sol-resumen {
        justify-content: space-between;
        color: rgba(0, 0, 0, 0.68);
        font-size: 0.8rem;
    }

    .paginador-sol select,
    .preajustes-sol input {
        width: 100%;
        padding: 0.35rem 0.45rem;
        border: 1px solid rgba(13, 50, 94, 0.2);
        border-radius: 0.25rem;
        background: white;
        color: inherit;
        font: inherit;
    }

    .paginador-sol label,
    .preajustes-sol label {
        display: grid;
        gap: 0.2rem;
        flex: 1 1 8rem;
    }

    .alternador-sol-modo-activo {
        background: var(--publico-navy, #0d325e) !important;
        color: white !important;
    }

    .alternador-sol-todos,
    .gestion-sol-columnas label {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        font-size: 0.84rem;
    }

    .gestion-sol-columnas {
        display: grid;
        gap: 0.4rem;
    }

    .preajustes-sol-lista {
        display: grid;
        gap: 0.4rem;
    }

    .preajustes-sol-aplicar {
        flex: 1 1 8rem;
        text-align: left;
    }

    .preajustes-sol-aplicar span {
        display: block;
        margin-top: 0.15rem;
        color: rgba(13, 50, 94, 0.62);
        font-size: 0.68rem;
        font-weight: 600;
    }
}