/* =====================================================================
   SIT Web — tema único. Paleta y medidas copiadas de App.xaml del wpfSit.
   ===================================================================== */
@font-face { font-family: "Inter"; font-weight: 400; src: url("/fonts/Inter-Regular.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Inter"; font-weight: 500; src: url("/fonts/Inter-Medium.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Inter"; font-weight: 600; src: url("/fonts/Inter-SemiBold.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Inter"; font-weight: 700; src: url("/fonts/Inter-Bold.ttf") format("truetype"); font-display: swap; }

:root {
    /* Colores de App.xaml */
    --navy-950: #0B1626;
    --navy-900: #14233B;
    --navy-800: #1E2E4A;
    --navy-700: #2E415F;
    --sky-500: #38BDF8;
    --sky-300: #93D8FB;
    --paper: #F8FAFC;
    --slate-700: #334155;
    --slate-500: #64748B;
    --slate-300: #CBD5E1;
    --slate-200: #E2E8F0;
    --field-bg: #CED5E0;
    --field-bg-focus: #DBE1EA;
    --app-bg: #F4F6FA;
    --error: #DC2626;

    /* Sidebar (alphas de App.xaml sobre Paper / Sky) */
    --sb-hover: rgba(56, 189, 248, .12);
    --sb-active: rgba(56, 189, 248, .16);
    --sb-text: rgba(248, 250, 252, .75);
    --sb-text-muted: rgba(248, 250, 252, .62);
    --sb-divider: rgba(248, 250, 252, .08);

    --hero: linear-gradient(135deg, var(--navy-800) 0%, var(--navy-950) 100%);
    --form: linear-gradient(180deg, #EEF2F8 0%, #E4EBF3 100%);

    --menu-ancho: 260px;
    --franja-alto: 52px;
    --ui: "Inter", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; font-family: var(--ui); color: var(--navy-900); background: var(--app-bg); -webkit-font-smoothing: antialiased; }
button, input { font-family: inherit; }

/* =====================================================================
   LOGIN (frmLogin)
   ===================================================================== */
.login-fondo {
    min-height: 100vh; min-height: 100dvh;
    display: flex; align-items: center; justify-content: center;
    padding: 28px;
    background: var(--app-bg);
}

.login-card {
    width: 900px; max-width: 100%;
    min-height: 560px;
    display: grid;
    grid-template-columns: 0.85fr 1fr;
    border-radius: 0 80px 0 80px;      /* esquinas asimétricas 0/80/0/80 */
    overflow: hidden;
    background: #fff;
    box-shadow: 0 12px 40px rgba(31, 41, 55, .35);
}
.login-card.shake { animation: shake .42s ease-in-out; }
@keyframes shake {
    0% { transform: translateX(0); } 20% { transform: translateX(-8px); } 40% { transform: translateX(8px); }
    60% { transform: translateX(-5px); } 80% { transform: translateX(5px); } 100% { transform: translateX(0); }
}

/* Panel izquierdo (hero navy) */
.login-hero {
    background: var(--hero);
    border-radius: 0 0 0 80px;
    padding: 32px 36px;
    display: flex; flex-direction: column;
    color: var(--paper);
}
.login-hero img { height: 96px; width: auto; align-self: flex-start; }
.login-hero .bienvenida { flex: 1; display: flex; flex-direction: column; justify-content: center; }
.login-hero h1 { margin: 0; font-size: 56px; font-weight: 800; line-height: 1.05; letter-spacing: -.5px; }
.login-hero .raya { width: 64px; height: 3px; border-radius: 2px; background: var(--sky-500); margin: 12px 0 14px; }
.login-hero p { margin: 0; max-width: 280px; font-size: 14px; line-height: 21px; color: rgba(248, 250, 252, .70); }
.login-hero .version { font-size: 11px; color: rgba(248, 250, 252, .50); }

/* Panel derecho (formulario) */
.login-form {
    background: var(--form);
    border-radius: 0 80px 0 0;
    padding: 40px 56px;
    display: flex; flex-direction: column; justify-content: center;
}
.login-pill { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; font-size: 11px; font-weight: 600; letter-spacing: .4px; color: var(--slate-500); }
.login-pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--sky-500); }
.login-form h2 { margin: 0; font-size: 28px; font-weight: 700; color: #0F172A; }
.login-form h2 b { font-weight: 800; }
.login-form .sub { margin: 6px 0 18px; font-size: 14px; color: var(--slate-500); }

.campo label { display: block; font-size: 14px; font-weight: 700; color: var(--navy-800); margin-bottom: 8px; text-transform: uppercase; }
.campo input {
    width: 100%; height: 54px;
    padding: 0 16px;
    font-size: 16px; font-weight: 500; color: var(--navy-900);
    background: var(--field-bg);
    border: 1.5px solid rgba(48, 70, 104, .20);
    border-radius: 12px;
    outline: none;
    transition: background .15s, border-color .15s;
}
.campo input:focus { background: var(--field-bg-focus); border-color: var(--navy-700); }
.campo + .campo { margin-top: 18px; }
.campo .ayuda { display: block; min-height: 16px; margin-top: 4px; font-size: 12px; color: var(--error); }

.login-error { min-height: 18px; margin: 6px 0 14px; text-align: right; font-size: 12px; color: var(--error); }

.login-botones { display: grid; grid-template-columns: 1.2fr 1fr; gap: 10px; }
.btn { height: 54px; border-radius: 12px; font-size: 15px; cursor: pointer; border: 1.5px solid transparent; transition: background .15s, border-color .15s; }
.btn-primario { background: var(--navy-800); color: var(--paper); font-weight: 600; }
.btn-primario:hover { background: var(--navy-900); }
.btn-primario:active { background: var(--navy-950); }
.btn-primario:disabled { opacity: .7; cursor: default; }
.btn-secundario { background: #fff; color: var(--slate-700); font-weight: 500; border-color: var(--slate-200); }
.btn-secundario:hover { background: #F1F5F9; border-color: var(--slate-300); }

/* Tablet / teléfono: una sola columna, hero arriba */
@media (max-width: 860px) {
    .login-fondo { padding: 16px; align-items: flex-start; }
    .login-card { grid-template-columns: 1fr; min-height: 0; border-radius: 0 48px 0 48px; }
    .login-hero { border-radius: 0 0 0 48px; padding: 24px 28px; }
    .login-hero img { height: 64px; }
    .login-hero .bienvenida { margin-top: 18px; }
    .login-hero h1 { font-size: 36px; }
    .login-hero .version { margin-top: 18px; }
    .login-form { border-radius: 0; padding: 28px 28px 32px; }
}
@media (max-width: 480px) {
    .login-fondo { padding: 0; }
    .login-card { border-radius: 0; box-shadow: none; min-height: 100dvh; }
    .login-hero { border-radius: 0; }
    .login-hero p { display: none; }
    .login-botones { grid-template-columns: 1fr; }
}

/* =====================================================================
   MARCO PRINCIPAL (frmPrincipal): menú lateral + contenido
   ===================================================================== */
.app { display: grid; grid-template-columns: var(--menu-ancho) 1fr; height: 100vh; height: 100dvh; transition: grid-template-columns .2s ease; }
body.menu-oculto .app { grid-template-columns: var(--menu-riel) 1fr; }
:root { --menu-riel: 52px; }

/* ---- Sidebar ---- */
.sidebar {
    grid-column: 1;
    background: var(--hero);
    display: flex; flex-direction: column;
    overflow: hidden;
    transition: transform .2s ease, width .2s ease;
}

.sb-logo { display: flex; align-items: center; padding: 18px 12px 14px 20px; }
.sb-logo img { height: 44px; width: auto; }
.sb-logo-texto { margin-left: 12px; flex: 1; min-width: 0; white-space: nowrap; }
.sb-logo .kicker { font-size: 9px; font-weight: 600; letter-spacing: .6px; color: var(--sky-300); }
.sb-logo .nombre { font-size: 13px; font-weight: 600; color: var(--sb-text); }
.sb-divisor { height: 1px; background: var(--sb-divider); margin: 0 16px; }

/* Botón discreto de ocultar/mostrar: vive DENTRO del menú, no sobre la ventana */
.btn-menu {
    width: 30px; height: 30px; flex: 0 0 30px;
    display: grid; place-items: center;
    border-radius: 8px; border: 0; background: transparent;
    color: var(--sb-text-muted); cursor: pointer; padding: 0;
    transition: background .15s, color .15s;
    -webkit-tap-highlight-color: transparent;
}
.btn-menu:hover { background: var(--sb-hover); color: var(--paper); }
.btn-menu:focus-visible { outline: 2px solid var(--sky-500); outline-offset: 2px; }
.btn-menu svg { width: 18px; height: 18px; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; fill: none; }
.btn-menu .chev-r { display: none; }
body.menu-oculto .btn-menu .chev-l { display: none; }
body.menu-oculto .btn-menu .chev-r { display: block; }

/* Escritorio con el menú escondido: queda un riel angosto con solo el botón */
body.menu-oculto .sidebar { width: var(--menu-riel); }
body.menu-oculto .sb-logo { padding: 14px 0; justify-content: center; }
body.menu-oculto .sb-logo img, body.menu-oculto .sb-logo-texto,
body.menu-oculto .sb-nav, body.menu-oculto .sb-pie, body.menu-oculto .sb-divisor { display: none; }

.sb-nav { flex: 1; overflow-y: auto; padding: 12px 12px 8px; scrollbar-width: none; }
.sb-nav::-webkit-scrollbar { display: none; }

.mi {
    display: flex; align-items: center; width: 100%;
    padding: 9px 12px; margin: 1px 0;
    border: 0; border-radius: 10px; background: transparent;
    color: var(--sb-text); font-size: 13.5px; font-weight: 500; text-align: left;
    cursor: pointer; white-space: nowrap; text-decoration: none;
}
.mi:hover { background: var(--sb-hover); }
.mi.activo { background: var(--sb-active); }
.mi svg { width: 20px; height: 20px; flex: 0 0 20px; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.mi span { margin-left: 10px; }

.grupo > .mi .chev { margin-left: auto; width: 14px; height: 14px; flex-basis: 14px; transition: transform .18s; opacity: .7; }
.grupo.abierto > .mi .chev { transform: rotate(90deg); }
.submenu { display: none; margin: 2px 0 4px 16px; }
.grupo.abierto > .submenu { display: block; }
.submenu .mi svg { width: 16px; height: 16px; flex-basis: 16px; }

.sb-pie { padding: 12px 14px 16px; }
.sb-pie .sb-divisor { margin: 0 0 12px; }
.sb-usuario { display: flex; align-items: center; gap: 10px; }
.avatar { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, var(--sky-500), var(--sky-300)); color: var(--navy-900); font-weight: 700; font-size: 13px; flex: 0 0 36px; }
.sb-usuario .datos { flex: 1; min-width: 0; }
.sb-usuario .codigo { font-size: 13px; font-weight: 600; color: var(--paper); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sb-usuario .rol { font-size: 10.5px; color: var(--sb-text-muted); }
.btn-salir { width: 28px; height: 28px; border: 0; background: transparent; cursor: pointer; color: var(--sb-text-muted); border-radius: 6px; display: grid; place-items: center; }
.btn-salir:hover { background: var(--sb-hover); color: var(--paper); }
.btn-salir svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.sb-version { margin-top: 12px; text-align: center; font-size: 10px; color: rgba(248, 250, 252, .40); }

/* ---- Contenido: ocupa todo el alto; cada vista decide si hace scroll o no ---- */
.contenido { grid-column: 2; min-width: 0; min-height: 0; overflow: auto; padding: 20px 24px; }
.tarjeta { background: #fff; border: 1px solid #D8DFE8; border-radius: 6px; padding: 16px 18px; }
.rotulo { font-size: 10px; font-weight: 600; letter-spacing: .8px; text-transform: uppercase; color: var(--slate-500); }

/* ---- Botón flotante del menú: SOLO teléfono/tablet ---- */
.btn-menu-movil { display: none; }
.hamburguesa { width: 20px; height: 20px; stroke: currentColor; stroke-width: 2; stroke-linecap: round; fill: none; }

/* ---- Teléfono / tablet: el menú se vuelve un cajón ---- */
.sb-fondo { display: none; }
@media (max-width: 900px) {
    .app, body.menu-oculto .app { grid-template-columns: 1fr; }
    .sidebar, body.menu-oculto .sidebar { position: fixed; inset: 0 auto 0 0; z-index: 30; width: var(--menu-ancho); transform: translateX(-100%); box-shadow: 8px 0 30px rgba(0,0,0,.35); }
    body.menu-oculto .sb-logo { padding: 18px 12px 14px 20px; justify-content: flex-start; }
    body.menu-oculto .sb-logo img, body.menu-oculto .sb-logo-texto, body.menu-oculto .sb-nav, body.menu-oculto .sb-pie, body.menu-oculto .sb-divisor { display: revert; }
    body.menu-oculto .btn-menu .chev-l { display: block; } body.menu-oculto .btn-menu .chev-r { display: none; }
    body.menu-abierto .sidebar { transform: translateX(0); }
    .sb-fondo { position: fixed; inset: 0; z-index: 20; background: rgba(11, 22, 38, .55); }
    body.menu-abierto .sb-fondo { display: block; }
    .contenido { grid-column: 1; padding: 14px; padding-top: 56px; }
    .btn-menu-movil {
        display: grid; place-items: center;
        position: fixed; top: 10px; left: 12px; z-index: 15;
        width: 36px; height: 36px; border-radius: 10px; border: 1px solid rgba(255,255,255,.14);
        background: rgba(20, 35, 59, .85); color: var(--paper); backdrop-filter: blur(6px);
        cursor: pointer; padding: 0; -webkit-tap-highlight-color: transparent;
    }
    body.menu-abierto .btn-menu-movil { display: none; }
}

/* =====================================================================
   SitGrid — DataGrid del SIT. Colores tomados de la captura del wpfSit:
   encabezado #2C5E90 (separadores #1F4566, texto blanco), filas #E8F0F9 / #D7E3F0
   con líneas blancas entre columnas, texto navy, selección #B8D2E8.
   ===================================================================== */
:root {
    --sg-head: #2C5E90; --sg-head-sep: #1F4566; --sg-head-texto: #FFFFFF;
    --sg-fila: #E8F0F9; --sg-fila-alt: #D7E3F0; --sg-fila-hover: #CCDDEE; --sg-sel: #B8D2E8;
    --sg-texto: #1E3A5F; --sg-sel-texto: #0B1626; --sg-linea: #FFFFFF;
}
.sitgrid { position: relative; flex: 1; height: 100%; min-height: 0; display: flex; flex-direction: column; outline: none; border: 1px solid var(--sg-head-sep); border-radius: 4px; overflow: hidden; background: var(--sg-fila); }
.sitgrid:focus-visible { box-shadow: 0 0 0 2px var(--sky-500); }
.sg-scroll { flex: 1; min-height: 0; overflow: auto; }
.sg-tabla { border-collapse: separate; border-spacing: 0; table-layout: fixed; font-size: 12px; color: var(--sg-texto); min-width: 100%; }
.sg-tabla th {
    position: sticky; top: 0; z-index: 2;
    height: 36px; padding: 0 10px;
    background: var(--sg-head); color: var(--sg-head-texto);
    font-size: 12px; font-weight: 600; text-align: center; white-space: nowrap;
    border-right: 1px solid var(--sg-head-sep); border-bottom: 1px solid var(--sg-head-sep);
    cursor: pointer; user-select: none;
}
.sg-tabla th:hover { background: #336A9F; }
.sg-tabla th.sg-th-activo { background: #24507C; }
.sg-th-texto { overflow: hidden; text-overflow: ellipsis; display: inline-block; max-width: 100%; vertical-align: middle; }
.sg-th-icos { display: inline-flex; vertical-align: middle; margin-left: 4px; }
.sg-th-icos svg { width: 12px; height: 12px; stroke: currentColor; stroke-width: 2.2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.sg-resize { position: absolute; top: 0; right: -4px; width: 9px; height: 100%; cursor: col-resize; z-index: 3; }
.sg-resize:hover, .sg-redimensionando .sg-resize { background: rgba(56, 189, 248, .35); }
.sg-redimensionando { cursor: col-resize; user-select: none; }
.sg-tabla td { height: 32px; padding: 0 10px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-right: 1px solid var(--sg-linea); }
.sg-tabla td.izq { text-align: left; }
.sg-tabla td.der { text-align: right; }
.sg-tabla tbody tr { background: var(--sg-fila); cursor: pointer; }
.sg-tabla tbody tr:nth-child(even) { background: var(--sg-fila-alt); }
.sg-tabla tbody tr:hover { background: var(--sg-fila-hover); }
.sg-tabla tbody tr.sel, .sg-tabla tbody tr.sel:hover { background: var(--sg-sel); color: var(--sg-sel-texto); font-weight: 500; }
.sg-vacio { padding: 28px; text-align: center; font-size: 13px; color: var(--slate-500); }

/* =====================================================================
   SitDialog — MessageBox del SIT sobre el modal de Bootstrap.
   Tarjeta centrada: franja de color arriba, insignia redonda con el icono
   montada sobre la franja, título y texto centrados, botones centrados.
   ===================================================================== */
.sit-dialogo .modal-sm { max-width: 420px; }
.sit-dialogo.modal { z-index: 1070; }   /* por encima de los modales de formulario (dlg*) */
.sit-dialogo .modal-content {
    --sd-color: #2563EB;
    border: 0; border-radius: 18px; overflow: hidden;
    background: #fff; font-family: var(--ui); text-align: center;
    box-shadow: 0 24px 70px rgba(11, 22, 38, .40);
}
.sit-dialogo.modal.fade .modal-dialog { transform: translateY(14px) scale(.96); transition: transform .22s cubic-bezier(.2, .8, .2, 1), opacity .22s; }
.sit-dialogo.modal.show .modal-dialog { transform: none; }
.sit-dialogo .sd-franja { height: 64px; background: linear-gradient(135deg, var(--navy-800), var(--navy-950)); position: relative; }
.sit-dialogo .sd-franja::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--sd-color); opacity: .9; }
.sit-dialogo .sd-insignia {
    width: 64px; height: 64px; margin: -32px auto 0; border-radius: 50%;
    background: #fff; display: grid; place-items: center; position: relative;
    box-shadow: 0 6px 18px rgba(11, 22, 38, .18);
}
.sit-dialogo .sd-insignia::before { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: color-mix(in srgb, var(--sd-color) 12%, #fff); }
.sit-dialogo .sd-icono { position: relative; width: 28px; height: 28px; stroke: var(--sd-color); stroke-width: 1.9; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.sit-dialogo .modal-title { margin: 14px 24px 0; font-size: 17px; font-weight: 700; color: var(--navy-900); letter-spacing: -.2px; }
.sit-dialogo .modal-body { padding: 8px 26px 4px; font-size: 13.5px; color: var(--slate-700); white-space: pre-line; line-height: 1.55; }
.sit-dialogo .modal-footer { border: 0; padding: 14px 20px 22px; justify-content: center; gap: 10px; }
.sit-dialogo .modal-footer > * { margin: 0; }
.sit-dialogo .btn { min-width: 118px; border-radius: 999px; font-size: 13px; font-weight: 600; padding: 9px 20px; transition: transform .12s, background .15s, box-shadow .15s; }
.sit-dialogo .btn:active { transform: scale(.97); }
.sit-dialogo .btn-sit { background: var(--navy-800); color: var(--paper); border: 1px solid var(--navy-800); box-shadow: 0 6px 16px rgba(30, 46, 74, .28); }
.sit-dialogo .btn-sit:hover { background: var(--navy-900); color: var(--paper); box-shadow: 0 8px 20px rgba(30, 46, 74, .34); }
.sit-dialogo .btn-sit:focus-visible { outline: 2px solid var(--sky-500); outline-offset: 2px; }
.sit-dialogo .btn-sit-sec { background: #fff; color: var(--slate-700); border: 1px solid var(--slate-200); }
.sit-dialogo .btn-sit-sec:hover { background: #F1F5F9; border-color: var(--slate-300); }
.sit-dialogo .modal-backdrop.show { opacity: .55; }
@media (max-width: 480px) {
    .sit-dialogo .modal-footer { flex-direction: column-reverse; }
    .sit-dialogo .btn { width: 100%; }
}
/* Bootstrap no debe cambiar la tipografía ni el fondo que ya define el SIT */
body { font-family: var(--ui); }

/* =====================================================================
   Modales de formulario del SIT (dlg* del WPF) sobre el modal de Bootstrap
   ===================================================================== */
.sit-form .modal-content { border: 0; border-radius: 14px; font-family: var(--ui); box-shadow: 0 24px 70px rgba(11, 22, 38, .40); }
.sit-form .modal-header { border-bottom: 1px solid #EDF1F7; padding: 14px 18px 10px; }
.sit-form .modal-title { font-size: 14px; font-weight: 700; color: var(--navy-900); }
.sit-form .modal-body { padding: 14px 18px; font-size: 13px; color: var(--slate-700); }
.sit-form .modal-footer { border-top: 1px solid #EDF1F7; padding: 10px 14px; gap: 10px; justify-content: flex-end; }
.sit-form .modal-footer > * { margin: 0; }
.sit-form .btn { min-width: 100px; border-radius: 8px; font-size: 13px; font-weight: 600; padding: 7px 16px; }
.sit-form .btn-sit { background: var(--sky-500); color: #fff; border: 1px solid var(--sky-500); }
.sit-form .btn-sit:hover { background: #0EA5E9; color: #fff; }
.sit-form .btn-sit:disabled { opacity: .5; }
.sit-form .btn-sit-sec { background: #fff; color: var(--slate-700); border: 1px solid var(--slate-200); }
.sit-form .btn-sit-sec:hover { background: #F1F5F9; }
.sf-textarea, .sf-input { width: 100%; border: 1px solid #DDE3EC; border-radius: 8px; padding: 6px 8px; font: inherit; font-size: 13px; color: var(--navy-900); outline: none; resize: vertical; }
.sf-textarea:focus, .sf-input:focus { border-color: var(--navy-700); }
.sf-ayuda { text-align: right; font-size: 11px; color: #94A3B8; margin-top: 4px; }
.sf-datos { display: grid; grid-template-columns: repeat(4, auto); gap: 6px 18px; align-items: baseline; margin-bottom: 14px; }
.sf-datos > div { display: contents; }
.sf-datos .sf-ancho .sf-dato { grid-column: span 3; }
.sf-rotulo { font-size: 10px; font-weight: 700; color: var(--slate-500); letter-spacing: .3px; }
.sf-dato { font-size: 13px; font-weight: 600; color: var(--navy-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sf-dato--g { font-size: 14px; }
.sf-seccion { font-size: 12px; font-weight: 600; color: #475569; margin: 10px 0 4px; }
.sf-combo { position: relative; }
.sf-opciones { list-style: none; margin: 4px 0 0; padding: 4px; max-height: 200px; overflow: auto; border: 1px solid #DDE3EC; border-radius: 8px; background: #fff; }
.sf-opciones li { display: flex; justify-content: space-between; gap: 8px; padding: 5px 8px; border-radius: 6px; cursor: pointer; font-size: 12.5px; }
.sf-opciones li:hover { background: #F1F5F9; }
.sf-opciones li.sel { background: #B9E2F5; }
.sf-opciones li .unidad { font-weight: 600; color: var(--slate-500); }
.sf-opciones li.sep { height: 1px; background: #E2E8F0; padding: 0; margin: 4px 0; cursor: default; }
.sf-opciones li.vacio { color: #94A3B8; cursor: default; }
.sf-cortes { list-style: none; margin: 0; padding: 4px 8px; max-height: 120px; overflow: auto; border: 1px solid #EDF1F7; border-radius: 8px; font-size: 12px; font-variant-numeric: tabular-nums; }
.sf-cortes li { padding: 3px 4px; }
.sf-totales { display: grid; grid-template-columns: repeat(8, 1fr); gap: 8px; margin-top: 12px; text-align: center; }
.sf-cifra { font-size: 15px; font-weight: 700; color: var(--navy-900); }
.sf-aviso { margin-top: 10px; font-size: 11.5px; color: #64748B; }
@media (max-width: 600px) { .sf-totales { grid-template-columns: repeat(4, 1fr); } .sf-datos { grid-template-columns: auto auto; } .sf-datos .sf-ancho .sf-dato { grid-column: span 1; } }

/* dlgCorteManual / dlgEnviarCobrar */
.sf-campos { display: grid; grid-template-columns: auto 1fr; gap: 8px 12px; align-items: center; }
.sf-campos label { font-size: 12.5px; font-weight: 600; color: var(--slate-700); margin: 0; }
.sf-num { text-align: right; font-variant-numeric: tabular-nums; }
.sf-linea { margin: 12px 0; border: 0; border-top: 1px solid #EDF1F7; opacity: 1; }
.ec-cab { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.ec-cab label { font-size: 13px; font-weight: 700; color: var(--navy-900); margin: 0; }
.ec-cab .pd-select { height: 30px; font-size: 12.5px; }
.ec-carreras { font-size: 12px; color: #64748B; margin-left: 8px; }
.ec-grid { height: 300px; display: flex; flex-direction: column; }
.ec-grid .sitgrid { border-color: #EDF1F7; border-radius: 6px; background: #fff; }
.ec-grid .sg-tabla { font-size: 11.5px; color: #000; }
.ec-grid .sg-tabla th { background: #fff; color: #475569; font-size: 11px; height: 30px; border-right-color: #EDF1F7; border-bottom-color: #EDF1F7; cursor: default; }
.ec-grid .sg-tabla td { height: 28px; border-right-color: #F4F6FA; border-bottom: 1px solid #EDF1F7; }
.ec-grid .sg-tabla td.der { text-align: right; font-variant-numeric: tabular-nums; }
.ec-grid .sg-tabla tbody tr, .ec-grid .sg-tabla tbody tr:nth-child(even) { background: #fff; }
.ec-grid .sg-tabla tbody tr:hover { background: #F4F8FD; }
.ec-totales { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; margin-top: 12px; text-align: center; }
.ec-cant { font-size: 12px; color: var(--slate-500); }
.ec-valor { font-size: 13px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.ec-valor--g { font-size: 15px; }
.ec-neto { background: #F1F5F9; border-radius: 8px; padding: 4px 6px; }
.ec-pie { justify-content: space-between; }
.ec-pie .btn-sit { min-width: 140px; }
@media (max-width: 700px) { .ec-totales { grid-template-columns: repeat(3, 1fr); } .ec-cab .pd-select { width: 100% !imp