/* ============================================================================
   admin-base.css — sistema de diseño de ADMINISTRACIÓN (escritorio, PC). Agente «shell».
   Marco de la consola (barra superior, navegación, escritorio MDI, panel de alertas), tablero y piezas comunes
   que reutilizan las pantallas de todos los módulos (adm-pag*, adm-dlg*, adm-tabla-mini…).
   Todo color sale de los tokens --cs-* (residensoft-tema.css): claro y oscuro sin duplicar reglas. Optimizado para 1366×768 y 1920×1080.
   ============================================================================ */

html, body { height: 100%; }
body:has(.adm-app) { overflow: hidden; }

.adm-app { height: 100dvh; display: flex; flex-direction: column; background: var(--cs-bg); color: var(--cs-text); font-size: 14px; line-height: 1.4; }
.adm-app a { color: inherit; }
.adm-app h1, .adm-app h2, .adm-app h3 { margin: 0; color: var(--cs-ink); letter-spacing: -.01em; }

/* ---- piezas de la consola (la barra superior ya no existe: sus elementos van en la cinta, ver .adm-cinta-der) ---- */
.adm-icono-btn { width: 36px; height: 36px; display: inline-grid; place-items: center; border: 0; border-radius: 10px; background: transparent; color: var(--cs-text); cursor: pointer; position: relative; flex: none; }
.adm-icono-btn:hover { background: var(--cs-surface-2); }
.adm-icono-btn.on { background: var(--cs-primary-soft); color: var(--cs-primary-dark); }
.adm-marca { display: flex; align-items: center; gap: .6rem; min-width: 0; max-width: 280px; text-decoration: none; }
.adm-marca-logo { position: relative; width: 34px; height: 34px; border-radius: 10px; flex: none; display: grid; place-items: center; font-weight: 800; color: #fff; overflow: hidden;
    background: linear-gradient(135deg, var(--cs-primary), var(--cs-primary-dark)); }
.adm-marca-logo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: var(--cs-surface); }
.adm-marca-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.adm-marca-txt strong { font-size: .92rem; color: var(--cs-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-marca-txt small { color: var(--cs-muted); font-size: .72rem; }

.adm-buscar { position: relative; flex: 1 1 auto; max-width: 440px; margin: 0 auto 0 .5rem; display: flex; align-items: center; gap: .45rem; padding: 0 .7rem; height: 36px; border-radius: 10px;
    background: var(--cs-surface-2); border: 1px solid var(--cs-line); color: var(--cs-muted); }
.adm-buscar:focus-within { border-color: var(--cs-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--cs-primary) 18%, transparent); }
.adm-buscar-in { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--cs-text); font: inherit; }
.adm-buscar-res { position: absolute; left: 0; right: 0; top: calc(100% + 6px); margin: 0; padding: .3rem; list-style: none; background: var(--cs-surface); border: 1px solid var(--cs-line); border-radius: 12px; box-shadow: var(--cs-shadow-lg); z-index: 60; }
.adm-buscar-res li { display: flex; align-items: center; gap: .55rem; padding: .5rem .6rem; border-radius: 8px; cursor: pointer; color: var(--cs-text); }
.adm-buscar-res li small { margin-left: auto; color: var(--cs-muted); }
.adm-buscar-res li:hover, .adm-buscar-res li.sel { background: var(--cs-primary-soft); color: var(--cs-primary-dark); }

/* Lo que antes era la barra superior, ahora pegado a la derecha de la fila de pestañas de la cinta (RightContent de MbRibbon). */
.adm-cinta-der { display: flex; align-items: center; gap: .15rem; margin-left: auto; min-width: 0; }
.adm-cinta-der .adm-buscar { flex: none; width: 250px; max-width: 30vw; height: 32px; margin: 0 .5rem 0 0; }
.adm-cinta-der .adm-lic { min-width: 0; max-width: 320px; margin-right: .3rem; }
.adm-cinta-der .adm-lic > span { overflow: hidden; text-overflow: ellipsis; }
.adm-cinta-der .adm-icono-btn { width: 32px; height: 32px; }
.adm-cinta-der .adm-avatar { width: 30px; height: 30px; }
/* pantallas medianas: el texto de la licencia sobra (queda el icono y el detalle en su tooltip) para no empujar las pestañas de la cinta */
@media (max-width: 1280px) {
    .adm-cinta-der .adm-buscar { width: 190px; }
    .adm-cinta-der .adm-lic > span { display: none; }
    .adm-cinta-der .adm-lic { padding: .35rem .5rem; }
}
.adm-nav-marca { max-width: none; padding: 0 0 .5rem; margin-bottom: .35rem; border-bottom: 1px solid var(--cs-line); }
.adm-lic { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .65rem; margin-right: .4rem; border-radius: 999px; font-size: .75rem; font-weight: 700; text-decoration: none; white-space: nowrap; background: var(--cs-ok-bg); color: var(--cs-ok); }
.adm-lic--aviso { background: var(--cs-warn-bg); color: var(--cs-warn); }
.adm-lic--info { background: var(--cs-info-bg); color: var(--cs-info); }
.adm-lic--error { background: var(--cs-err-bg); color: var(--cs-err); }
.adm-badge { position: absolute; top: 1px; right: 0; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; font-size: .66rem; font-weight: 800; display: grid; place-items: center; background: var(--cs-warn); color: #fff; }
.adm-badge.err { background: var(--cs-err); }
.adm-avatar { width: 34px; height: 34px; border-radius: 50%; border: 0; margin-left: .3rem; font-weight: 800; font-size: .78rem; cursor: pointer; background: var(--cs-primary-soft); color: var(--cs-primary-dark); }
.adm-usuario { position: relative; }
.adm-menu-fondo { position: fixed; inset: 0; z-index: 70; }
.adm-menu-usuario { position: absolute; right: 0; top: calc(100% + 8px); width: 270px; z-index: 71; padding: .35rem; background: var(--cs-surface); border: 1px solid var(--cs-line); border-radius: 14px; box-shadow: var(--cs-shadow-lg); }
.adm-menu-cab { display: flex; flex-direction: column; padding: .6rem .7rem .7rem; border-bottom: 1px solid var(--cs-line); margin-bottom: .3rem; }
.adm-menu-cab strong { color: var(--cs-ink); } .adm-menu-cab small { color: var(--cs-muted); }
.adm-menu-usuario a { display: flex; align-items: center; gap: .6rem; padding: .55rem .7rem; border-radius: 9px; text-decoration: none; color: var(--cs-text); }
.adm-menu-usuario a:hover { background: var(--cs-surface-2); }
.adm-menu-usuario a.peligro { color: var(--cs-err); }

/* ---- navegación lateral ---- */
.adm-cuerpo { flex: 1; min-height: 0; display: flex; }
/* El «hueco» (slot) reserva el ancho en el layout; el menú va POR ENCIMA de él. Así, al expandirse con el mouse el menú flota sobre las pantallas
   y no las empuja (nada de reacomodar cuadrículas). */
.adm-nav-slot { flex: none; position: relative; width: 244px; z-index: 40; transition: width .16s ease; }
.adm-nav { position: absolute; inset: 0 auto 0 0; width: 100%; overflow-y: auto; overflow-x: hidden; padding: .5rem; background: var(--cs-surface); border-right: 1px solid var(--cs-line); transition: width .16s ease, box-shadow .16s ease; }
.adm-nav-item, .adm-nav-cab { display: flex; align-items: center; gap: .65rem; width: 100%; padding: .5rem .65rem; border: 0; border-radius: 9px; background: transparent; color: var(--cs-text);
    font: inherit; text-align: left; text-decoration: none; cursor: pointer; white-space: nowrap; }
.adm-nav-item:hover, .adm-nav-cab:hover { background: var(--cs-surface-2); }
.adm-nav-item.activo { background: var(--cs-primary-soft); color: var(--cs-primary-dark); font-weight: 700; }
.adm-nav-item.sub { padding-left: 1.6rem; font-size: .93em; }
.adm-nav-cab { font-weight: 700; color: var(--cs-ink); margin-top: .25rem; }
.adm-nav-mod.con-activo > .adm-nav-cab { color: var(--cs-primary-dark); }
.adm-nav-flecha { margin-left: auto; display: inline-grid; transition: transform .15s; color: var(--cs-muted); }
.adm-nav-flecha.abierto { transform: rotate(90deg); }
.adm-nav-grupo { padding: .55rem .65rem .15rem 1.6rem; font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--cs-faint); }

/* Menú COLAPSADO: carril de 54 px con sólo iconos. Al pasar el mouse (o enfocarlo con el teclado) se expande SOBRE el contenido. */
.nav-colapsada .adm-nav-slot { width: 54px; }
.nav-colapsada .adm-nav-slot .adm-nav { width: 54px; }
.nav-colapsada .adm-nav-slot:hover .adm-nav, .nav-colapsada .adm-nav-slot:focus-within .adm-nav { width: 244px; box-shadow: 6px 0 24px rgba(15, 23, 42, .16); }
.nav-colapsada .adm-nav-slot:not(:hover):not(:focus-within) .adm-nav :is(span:not(.adm-marca-logo), .adm-nav-flecha, .adm-nav-grupo) { display: none; }
.nav-colapsada .adm-nav-slot:not(:hover):not(:focus-within) .adm-nav :is(.adm-nav-item, .adm-nav-cab) { justify-content: center; padding-left: 0; padding-right: 0; }
/* pantallas angostas (< 900 px): el menú lateral se queda siempre en carril de iconos (y se expande al pasar el mouse) para dejarle sitio a las pestañas y las cuadrículas */
@media (max-width: 900px) {
    .adm-nav-slot { width: 54px; }
    .adm-nav-slot .adm-nav { width: 54px; }
    .adm-nav-slot:hover .adm-nav, .adm-nav-slot:focus-within .adm-nav { width: 244px; box-shadow: 6px 0 24px rgba(15, 23, 42, .16); }
    .adm-nav-slot:not(:hover):not(:focus-within) .adm-nav :is(span:not(.adm-marca-logo), .adm-nav-flecha, .adm-nav-grupo) { display: none; }
    .adm-nav-slot:not(:hover):not(:focus-within) .adm-nav :is(.adm-nav-item, .adm-nav-cab) { justify-content: center; padding-left: 0; padding-right: 0; }
}
@media (prefers-reduced-motion: reduce) { .adm-nav-slot, .adm-nav { transition: none; } }

/* ---- centro: banner + dock + escritorio ---- */
.adm-centro { flex: 1 1 auto; min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.adm-dock.mbx-dock.mbx-dock { flex: 1 1 auto; min-height: 0; border-radius: 0; border: 0; }
.adm-mdi.mbx-mdi.mbx-mdi { border-radius: 0; }
/* MARGEN del contenido principal: cada pantalla de módulo se dibuja dentro de un documento MDI sin relleno y sus páginas (.adm-fin, .adm-acc, .adm-res-pagina…) no ponen margen lateral,
   así que quedaban pegadas al menú. Se les da aire aquí, una sola vez. El tablero de Inicio (.mbx-mdi-inicio) ya trae el suyo en .adm-tab. */
.adm-mdi .mbx-mdi-doc:not(.mbx-mdi-inicio) { box-sizing: border-box; padding: .7rem 1.35rem 0; }
@media (max-width: 760px) { .adm-mdi .mbx-mdi-doc:not(.mbx-mdi-inicio) { padding: .5rem .75rem 0; } }
.adm-cargando { padding: 2rem; }
.adm-banner { flex: none; display: flex; align-items: center; gap: .65rem; padding: .5rem 1rem; font-weight: 600; background: var(--cs-info-bg); color: var(--cs-info); border-bottom: 1px solid var(--cs-line); }
.adm-banner > span { flex: 1; }
.adm-banner--aviso { background: var(--cs-warn-bg); color: var(--cs-warn); }
.adm-banner--error { background: var(--cs-err-bg); color: var(--cs-err); }
.adm-aviso-pantalla { margin: 3rem auto; max-width: 480px; padding: 1.5rem; text-align: center; background: var(--cs-surface); border: 1px solid var(--cs-line); border-radius: var(--cs-radius); display: flex; flex-direction: column; gap: .8rem; align-items: center; }
.adm-aviso-pantalla p { color: var(--cs-muted); }

/* ---- panel de alertas ---- */
.adm-alertas { display: flex; flex-direction: column; height: 100%; font-size: .9em; }
.adm-alertas-enc { display: flex; align-items: center; justify-content: space-between; padding: .4rem .7rem; color: var(--cs-muted); font-weight: 600; }
.adm-alertas-vacio { padding: 1.5rem 1rem; text-align: center; color: var(--cs-muted); display: flex; flex-direction: column; align-items: center; gap: .5rem; }
.adm-alertas-lista { list-style: none; margin: 0; padding: 0 .5rem .5rem; display: flex; flex-direction: column; gap: .4rem; overflow: auto; }
.adm-alertas-lista button { display: flex; gap: .65rem; width: 100%; padding: .65rem; text-align: left; font: inherit; color: var(--cs-text); background: var(--cs-surface); border: 1px solid var(--cs-line); border-left-width: 4px; border-radius: 10px; cursor: pointer; }
.adm-alertas-lista button:disabled { cursor: default; }
.adm-alertas-lista button:not(:disabled):hover { background: var(--cs-surface-2); }
.adm-alertas-lista .nivel-error button { border-left-color: var(--cs-err); } .adm-alertas-lista .nivel-aviso button { border-left-color: var(--cs-warn); } .adm-alertas-lista .nivel-info button { border-left-color: var(--cs-info); }
.adm-alerta-ico { flex: none; padding-top: 2px; } .nivel-error .adm-alerta-ico { color: var(--cs-err); } .nivel-aviso .adm-alerta-ico { color: var(--cs-warn); } .nivel-info .adm-alerta-ico { color: var(--cs-info); }
.adm-alerta-cuerpo { display: flex; flex-direction: column; min-width: 0; } .adm-alerta-cuerpo small { color: var(--cs-muted); } .adm-alerta-meta { font-size: .72rem; }

/* ---- tablero (inicio) ---- */
.adm-tab { height: 100%; overflow: auto; padding: 1rem 1.25rem 1.5rem; display: flex; flex-direction: column; gap: 1rem; font-size: 14px; color: var(--cs-text); }
.adm-tab-enc { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; }
.adm-tab-enc h1 { font-size: 1.5rem; font-weight: 800; } .adm-tab-enc p { color: var(--cs-muted); margin: .15rem 0 0; }
.adm-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }   /* 6 tarjetas: 3x2 en 1366 px, 6x1 en pantallas anchas, 2 en angosto (sin renglón huérfano) */
@media (min-width: 1700px) { .adm-kpis { grid-template-columns: repeat(6, 1fr); } }
@media (max-width: 900px) { .adm-kpis { grid-template-columns: repeat(2, 1fr); } }
.adm-kpi { background: var(--cs-surface); border: 1px solid var(--cs-line); border-radius: 14px; padding: .85rem 1rem; display: flex; flex-direction: column; gap: .15rem; position: relative; overflow: hidden; }
.adm-kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--cs-line); }
.adm-kpi.ok::before { background: var(--cs-ok); } .adm-kpi.warn::before { background: var(--cs-warn); } .adm-kpi.err::before { background: var(--cs-err); } .adm-kpi.info::before { background: var(--cs-info); }
.adm-kpi-et { color: var(--cs-muted); font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.adm-kpi-val { font-size: 1.65rem; font-weight: 800; color: var(--cs-ink); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.adm-kpi-sub { color: var(--cs-muted); font-size: .8rem; }
.adm-barra { height: 6px; border-radius: 3px; background: var(--cs-line); overflow: hidden; margin-top: .35rem; }
.adm-barra > i { display: block; height: 100%; border-radius: 3px; background: var(--cs-ok); }
.adm-barra.warn > i { background: var(--cs-warn); }
.adm-tab-rej { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; align-items: start; }
.adm-tarj { background: var(--cs-surface); border: 1px solid var(--cs-line); border-radius: 14px; padding: 1rem; min-width: 0; }
.adm-tarj.ancha { grid-column: span 2; }
.adm-tarj h2 { font-size: .98rem; font-weight: 800; margin-bottom: .6rem; }
@media (min-width: 1700px) { .adm-tab-rej { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1000px) { .adm-tab-rej { grid-template-columns: minmax(0, 1fr); } .adm-tarj.ancha { grid-column: auto; } }

.adm-graf { width: 100%; height: auto; max-height: 260px; display: block; }
.adm-graf .g-rej { stroke: var(--cs-line); stroke-width: 1; } .adm-graf .g-eje { fill: var(--cs-muted); font-size: 11px; }
rect.c-cargado { fill: color-mix(in srgb, var(--cs-muted) 45%, var(--cs-surface)); } rect.c-cobrado { fill: var(--cs-primary); }
.adm-leyenda { display: flex; gap: 1rem; color: var(--cs-muted); font-size: .8rem; margin-bottom: .25rem; }
.adm-leyenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: .35rem; }
i.c-cargado { background: color-mix(in srgb, var(--cs-muted) 45%, var(--cs-surface)); } i.c-cobrado { background: var(--cs-primary); }
.adm-hbar { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .65rem; }
.adm-hbar li { display: grid; grid-template-columns: 92px 1fr auto; align-items: center; gap: .6rem; }
.adm-hbar .et { color: var(--cs-muted); font-size: .82rem; } .adm-hbar .pista { height: 12px; border-radius: 6px; background: var(--cs-line); overflow: hidden; }
.adm-hbar .pista i { display: block; height: 100%; border-radius: 6px; min-width: 2px; }
.adm-hbar .tramo1 { background: var(--cs-warn); opacity: .65; } .adm-hbar .tramo2 { background: var(--cs-warn); } .adm-hbar .tramo3 { background: var(--cs-err); opacity: .75; } .adm-hbar .tramo4 { background: var(--cs-err); }
.adm-hbar .val { display: flex; flex-direction: column; align-items: flex-end; font-weight: 700; font-variant-numeric: tabular-nums; } .adm-hbar .val small { color: var(--cs-muted); font-weight: 500; }
.adm-dona-caja { display: flex; align-items: center; gap: 1.2rem; }
.adm-dona { width: 140px; height: 140px; flex: none; } .adm-dona circle { fill: none; stroke-width: 15; } .adm-dona .d-base { stroke: var(--cs-line); }
.adm-dona .d-num { font-size: 22px; font-weight: 800; fill: var(--cs-ink); } .adm-dona .d-et { font-size: 9px; fill: var(--cs-muted); }
.adm-dona circle.s0 { stroke: var(--cs-primary); } .adm-dona circle.s1 { stroke: var(--cs-info); } .adm-dona circle.s2 { stroke: var(--cs-warn); } .adm-dona circle.s3 { stroke: var(--cs-faint); } .adm-dona circle.s4 { stroke: var(--cs-err); }
.adm-dona-leyenda i.s0 { background: var(--cs-primary); } .adm-dona-leyenda i.s1 { background: var(--cs-info); } .adm-dona-leyenda i.s2 { background: var(--cs-warn); } .adm-dona-leyenda i.s3 { background: var(--cs-faint); } .adm-dona-leyenda i.s4 { background: var(--cs-err); }
.adm-dona-leyenda { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; flex: 1; }
.adm-dona-leyenda li { display: flex; align-items: center; gap: .5rem; } .adm-dona-leyenda i { width: 10px; height: 10px; border-radius: 3px; } .adm-dona-leyenda b { margin-left: auto; }
.adm-tabla-mini { width: 100%; border-collapse: collapse; } .adm-tabla-mini th { text-align: left; color: var(--cs-muted); font-size: .76rem; text-transform: uppercase; letter-spacing: .04em; padding: .3rem .4rem; border-bottom: 1px solid var(--cs-line); }
.adm-tabla-mini td { padding: .45rem .4rem; border-bottom: 1px solid var(--cs-line); font-variant-numeric: tabular-nums; } .adm-tabla-mini .der { text-align: right; }
.adm-datos { display: grid; grid-template-columns: auto 1fr; gap: .35rem 1rem; margin: 0 0 .6rem; } .adm-datos dt { color: var(--cs-muted); } .adm-datos dd { margin: 0; font-weight: 600; }
.adm-enlace { display: inline-block; margin-top: .6rem; font-weight: 700; color: var(--cs-primary); text-decoration: none; }
.adm-atajos { display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem; }
.adm-atajos a { display: flex; align-items: center; gap: .55rem; padding: .7rem; border: 1px solid var(--cs-line); border-radius: 10px; text-decoration: none; font-weight: 700; color: var(--cs-ink); }
.adm-atajos a:hover { background: var(--cs-primary-soft); }

/* ---- piezas comunes de las pantallas de los módulos ---- */
.adm-pag { height: 100%; display: flex; flex-direction: column; gap: .6rem; padding: .85rem 1rem 1rem; min-height: 0; font-size: 13.5px; color: var(--cs-text); }
.adm-pag-enc { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; flex: none; }
.adm-pag-enc h1 { font-size: 1.25rem; font-weight: 800; } .adm-pag-enc p { margin: .1rem 0 0; color: var(--cs-muted); }
.adm-herr { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; flex: none; }
.adm-herr .esp { flex: 1; }
.adm-grid-caja { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.adm-grid-caja > * { flex: 1 1 auto; min-height: 0; }
.adm-pag-cuerpo { flex: 1 1 auto; min-height: 0; overflow: auto; }
.adm-vacio { padding: 2rem; text-align: center; color: var(--cs-muted); }
.adm-nota { padding: .6rem .8rem; border-radius: 10px; background: var(--cs-info-bg); color: var(--cs-info); }
.adm-nota.warn { background: var(--cs-warn-bg); color: var(--cs-warn); } .adm-nota.err { background: var(--cs-err-bg); color: var(--cs-err); } .adm-nota.ok { background: var(--cs-ok-bg); color: var(--cs-ok); }
.adm-chip { display: inline-flex; align-items: center; gap: .25rem; padding: .12rem .55rem; border-radius: 999px; font-size: .74rem; font-weight: 700; background: var(--cs-line); color: var(--cs-muted); white-space: nowrap; }
.adm-chip.ok { background: var(--cs-ok-bg); color: var(--cs-ok); } .adm-chip.warn { background: var(--cs-warn-bg); color: var(--cs-warn); } .adm-chip.err { background: var(--cs-err-bg); color: var(--cs-err); } .adm-chip.info { background: var(--cs-info-bg); color: var(--cs-info); }
.adm-tarjeta { background: var(--cs-surface); border: 1px solid var(--cs-line); border-radius: 12px; padding: .9rem 1rem; }
.adm-tarjeta h2 { font-size: .95rem; font-weight: 800; margin-bottom: .55rem; }
.adm-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .7rem 1rem; align-items: start; }
.adm-form .completo { grid-column: 1 / -1; }
.adm-form-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: .75rem; align-items: start; }
.adm-filtros { display: flex; flex-wrap: wrap; gap: .6rem .9rem; align-items: flex-end; padding: .6rem .8rem; background: var(--cs-surface); border: 1px solid var(--cs-line); border-radius: 12px; flex: none; }
.adm-filtros label { display: flex; flex-direction: column; gap: .2rem; font-size: .74rem; font-weight: 700; color: var(--cs-muted); }
.adm-filtros input, .adm-filtros select { min-height: 34px; padding: 0 .55rem; border-radius: 8px; border: 1px solid var(--cs-line); background: var(--cs-surface); color: var(--cs-text); font: inherit; }

/* ---- diálogo modal ---- */
.adm-dlg-fondo { position: fixed; inset: 0; z-index: 900; background: rgba(11, 18, 32, .5); }
.adm-dlg { position: fixed; z-index: 901; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(560px, 96vw); max-height: 92vh; display: flex; flex-direction: column;
    background: var(--cs-surface); color: var(--cs-text); border-radius: 16px; box-shadow: var(--cs-shadow-lg); border: 1px solid var(--cs-line); }
.adm-dlg-enc { display: flex; align-items: center; justify-content: space-between; padding: .8rem 1rem .6rem 1.25rem; border-bottom: 1px solid var(--cs-line); }
.adm-dlg-enc h2 { font-size: 1.1rem; font-weight: 800; }
.adm-dlg-cuerpo { padding: 1rem 1.25rem; overflow: auto; display: flex; flex-direction: column; gap: .8rem; }
.adm-dlg-pie { padding: .75rem 1.25rem; border-top: 1px solid var(--cs-line); display: flex; justify-content: flex-end; gap: .6rem; }

/* ---- botones compactos de escritorio ---- */
.adm-app .cs-btn { min-height: 36px; padding: 0 1rem; border-radius: 10px; font-size: .9rem; }
.adm-app .cs-btn--sm { min-height: 30px; padding: 0 .75rem; font-size: .82rem; }
