/* /Layout/LoginLayout.razor.rz.scp.css */
.login-page[b-i2gmawk1jb] {
    position: relative;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    padding: 1rem;
    background-image: linear-gradient(180deg, var(--color-navy-dark) 0%, var(--color-navy) 100%);
}

.login-brand[b-i2gmawk1jb] {
    color: #fff;
    text-align: center;
}

    .login-brand .login-escudo[b-i2gmawk1jb] {
        height: 96px;
        width: auto;
        margin-bottom: 0.75rem;
    }

    .login-brand h1[b-i2gmawk1jb] {
        margin: 0;
        font-weight: 700;
        letter-spacing: 0.05em;
    }

.login-body[b-i2gmawk1jb] {
    width: 100%;
    display: flex;
    justify-content: center;
}

.login-credito[b-i2gmawk1jb] {
    position: absolute;
    left: 50%;
    bottom: 14px;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, .5);
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

    .login-credito img[b-i2gmawk1jb] {
        height: 18px;
        width: auto;
    }

    .login-credito:hover[b-i2gmawk1jb] {
        color: rgba(255, 255, 255, .8);
        text-decoration: none;
    }
/* /Layout/MainLayout.razor.rz.scp.css */
.page[b-nfrrc1snr7] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: var(--color-bg);
    padding: 14px;
    gap: 14px;
}

main[b-nfrrc1snr7] {
    flex: 1;
    min-width: 0;
}

.sidebar[b-nfrrc1snr7] {
    background-image: linear-gradient(180deg, var(--color-navy-dark) 0%, var(--color-navy) 100%);
    border-radius: 28px;
    padding: 22px 16px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.sidebar-brand[b-nfrrc1snr7] {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 0 6px;
}

.sidebar-escudo[b-nfrrc1snr7] {
    height: 44px;
    width: auto;
    flex: 0 0 auto;
}

.sidebar-brand-text[b-nfrrc1snr7] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.sidebar-brand-title[b-nfrrc1snr7] {
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.15;
}

.sidebar-brand-sub[b-nfrrc1snr7] {
    color: rgba(255, 255, 255, .65);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.sidebar-usuario[b-nfrrc1snr7] {
    margin-top: auto;
    background: rgba(0, 0, 0, .22);
    border-radius: 20px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.sidebar-usuario-nombre[b-nfrrc1snr7] {
    color: #fff;
    font-size: 15px;
    font-weight: 700;
}

.sidebar-usuario-rol[b-nfrrc1snr7] {
    color: rgba(255, 255, 255, .7);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.sidebar-cerrar-sesion[b-nfrrc1snr7] {
    margin-top: 8px;
    align-self: flex-start;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    background: transparent;
    border: 2px solid rgba(255, 255, 255, .45);
    border-radius: 999px;
    padding: 8px 16px;
    cursor: pointer;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

    .sidebar-cerrar-sesion:hover[b-nfrrc1snr7] {
        background: rgba(255, 255, 255, .14);
        color: #fff;
        text-decoration: none;
    }

.sidebar-credito[b-nfrrc1snr7] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 6px;
    color: rgba(255, 255, 255, .5);
    font-size: 11px;
    font-weight: 600;
    text-decoration: none;
}

    .sidebar-credito img[b-nfrrc1snr7] {
        height: 16px;
        width: auto;
        flex: 0 0 auto;
    }

    .sidebar-credito:hover[b-nfrrc1snr7] {
        color: rgba(255, 255, 255, .8);
        text-decoration: none;
    }

@media (min-width: 641px) {
    .page[b-nfrrc1snr7] {
        flex-direction: row;
        align-items: flex-start;
    }

    .sidebar[b-nfrrc1snr7] {
        flex: 0 0 268px;
        min-width: 240px;
        position: sticky;
        top: 14px;
        align-self: flex-start;
        max-height: calc(100vh - 28px);
        overflow-y: auto;
    }
}
/* /Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-dx8r9t60a7] {
    background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-dx8r9t60a7] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.25);
}

.navbar-brand[b-dx8r9t60a7] {
    font-size: 1.1rem;
}

.nav-group-title[b-dx8r9t60a7] {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: rgba(255, 255, 255, .55);
    padding: 14px 12px 2px;
}

    .nav-group-title:first-of-type[b-dx8r9t60a7] {
        padding-top: 0;
    }

.nav-item[b-dx8r9t60a7] {
    padding-bottom: 6px;
}

    .nav-item[b-dx8r9t60a7]  a {
        color: #fff;
        font-size: 15px;
        font-weight: 700;
        border-radius: 999px;
        padding: 13px 16px;
        min-height: 48px;
        display: flex;
        align-items: center;
        gap: 11px;
        background: transparent;
    }

        .nav-item[b-dx8r9t60a7]  a svg {
            flex: 0 0 auto;
        }

.nav-item[b-dx8r9t60a7]  a.active {
    background: rgba(255, 255, 255, .22);
}

.nav-item[b-dx8r9t60a7]  a:hover {
    background: rgba(255, 255, 255, .14);
    color: #fff;
}

@media (min-width: 641px) {
    .top-row[b-dx8r9t60a7] {
        display: none;
    }

    .collapse[b-dx8r9t60a7] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }

    .nav-scrollable[b-dx8r9t60a7] {
        /* Allow sidebar to scroll for tall menus */
        overflow-y: auto;
    }
}
/* /Layout/PantallaLayout.razor.rz.scp.css */
/*
 * VC-076: en las otras tres pantallas (login, panel, público) este crédito vive en un pie de
 * página normal, fuera de la vista principal. Aquí no hay pie de página — todo el "main" es la
 * pantalla que se proyecta en la sala — así que antes vivía en la barra superior fija, junto a
 * "Volver", donde competía por atención con lo primero que se ve desde lejos. Se saca de esa
 * barra (que ahora solo tiene el botón) y se fija en una esquina inferior derecha, sin el
 * logo — solo texto, 10px, opacidad baja. Como ya no vive sobre el fondo oscuro de la barra, el
 * color también cambió (de blanco casi transparente a un gris oscuro casi transparente,
 * rgba(46, 43, 37, ...)) — con el color anterior habría quedado invisible sobre el fondo claro
 * del contenido.
 *
 * VC-081: la barra que mencionaba el párrafo anterior ya no existe en este layout (se movió
 * dentro del lienzo escalado de Pantalla.razor) — el vecino cambió, los valores de esta regla
 * no debían cambiar (y no lo hicieron a propósito: -qa encontró que sí cambiaron, opacidad .35
 * a .22, al reescribir este archivo completo con Write en vez de Edit — restaurados los valores
 * exactos de VC-076 aquí).
 */
.pantalla-credito[b-s6okmzaccz] {
    position: fixed;
    right: 10px;
    bottom: 6px;
    color: rgba(46, 43, 37, .35);
    font-size: 10px;
    font-weight: 600;
    text-decoration: none;
    z-index: 1;
}

    .pantalla-credito:hover[b-s6okmzaccz] {
        color: rgba(46, 43, 37, .75);
        text-decoration: none;
    }
/* /Layout/PublicoLayout.razor.rz.scp.css */
.portal-publico[b-yr1ch5pxij] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: #f5ead8;
    color: #2e2b25;
    font-family: 'Figtree', system-ui, sans-serif;
}

.pp-header[b-yr1ch5pxij] {
    background-image: linear-gradient(180deg, #780E3F 0%, #9B2243 100%);
    color: #fff;
}

.pp-header-inner[b-yr1ch5pxij] {
    max-width: 1120px;
    margin: 0 auto;
    padding: 14px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.pp-escudo[b-yr1ch5pxij] {
    height: 48px;
    width: auto;
    flex: 0 0 auto;
}

.pp-marca[b-yr1ch5pxij] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.pp-marca-eyebrow[b-yr1ch5pxij] {
    font-size: 12px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .72);
    font-weight: 600;
}

.pp-marca-titulo[b-yr1ch5pxij] {
    font-size: 19px;
    font-weight: 700;
    line-height: 1.2;
}

.pp-main[b-yr1ch5pxij] {
    flex: 1;
}

.pp-footer[b-yr1ch5pxij] {
    background: #780E3F;
    color: rgba(255, 255, 255, .85);
}

.pp-footer-inner[b-yr1ch5pxij] {
    max-width: 1120px;
    margin: 0 auto;
    padding: 30px 20px;
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    align-items: center;
}

.pp-footer-escudo[b-yr1ch5pxij] {
    height: 40px;
    width: auto;
    opacity: .9;
}

.pp-footer-texto[b-yr1ch5pxij] {
    flex: 1 1 260px;
    min-width: 0;
    font-size: 15px;
    line-height: 1.6;
}

.pp-footer-acceso[b-yr1ch5pxij] {
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    border: 2px solid rgba(255, 255, 255, .5);
    border-radius: 999px;
    padding: 11px 22px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

    .pp-footer-acceso:hover[b-yr1ch5pxij] {
        background: rgba(255, 255, 255, .14);
        color: #fff;
        text-decoration: none;
    }

.pp-footer-credito[b-yr1ch5pxij] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    color: rgba(255, 255, 255, .6);
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
}

    .pp-footer-credito img[b-yr1ch5pxij] {
        height: 18px;
        width: auto;
    }

    .pp-footer-credito:hover[b-yr1ch5pxij] {
        color: rgba(255, 255, 255, .85);
        text-decoration: none;
    }
/* /Pages/Dispositivos/Index.razor.rz.scp.css */
/* Mismos tokens visuales que Usuarios/Index.razor.css (VC-021) — CSS aislado por Blazor,
   cada pantalla ADMIN mantiene su propia copia (mismo criterio que Integrantes/Usuarios). */

.encabezado[b-h5hga1oyjs] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.titulo[b-h5hga1oyjs] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-weight: 400;
    font-size: clamp(28px, 4vw, 42px);
    line-height: 1.1;
    margin: 0 0 6px;
    color: #780E3F;
}

.subtitulo[b-h5hga1oyjs] {
    margin: 0 0 1.5rem;
    font-size: 17px;
    color: #645C50;
}

.lista-card[b-h5hga1oyjs] {
    background: #fff;
    border-radius: 28px;
    padding: 10px;
    box-shadow: 0 1px 2px rgba(46, 43, 37, .14);
}

.lista-encabezado[b-h5hga1oyjs], .dispositivo-row[b-h5hga1oyjs] {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
}

.lista-encabezado[b-h5hga1oyjs] {
    padding: 16px 18px 10px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #A19786;
}

.dispositivo-row[b-h5hga1oyjs] {
    padding: 16px 18px;
    border-top: 1px solid #EEE7DB;
}

.col-codigo[b-h5hga1oyjs] {
    flex: 0 0 170px;
    font-size: 16px;
    font-weight: 800;
    color: #2e2b25;
}

.col-lugar[b-h5hga1oyjs] {
    flex: 1 1 150px;
    min-width: 0;
    font-size: 16px;
    color: #645C50;
}

.col-asignado[b-h5hga1oyjs] {
    flex: 1 1 150px;
    min-width: 0;
    font-size: 16px;
}

.col-contacto[b-h5hga1oyjs] {
    flex: 0 0 150px;
    font-size: 14px;
    color: #645C50;
}

.col-estatus[b-h5hga1oyjs] {
    flex: 0 0 150px;
    display: flex;
    justify-content: flex-end;
}

.col-acciones[b-h5hga1oyjs] {
    flex: 0 0 85px;
    display: flex;
    justify-content: flex-end;
}

.chip-estatus[b-h5hga1oyjs] {
    font-size: 13px;
    font-weight: 800;
    padding: 6px 14px;
    border-radius: 999px;
    white-space: nowrap;
}

.chip-estatus--activo[b-h5hga1oyjs] {
    background: #E8F0E7;
    color: #2F5334;
}

.chip-estatus--inactivo[b-h5hga1oyjs] {
    background: #EEE7DB;
    color: #645C50;
}

.btn-pastilla[b-h5hga1oyjs], .btn-pastilla-outline[b-h5hga1oyjs] {
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    padding: 10px 20px;
    border-radius: 999px;
    cursor: pointer;
    min-height: 44px;
}

.btn-pastilla[b-h5hga1oyjs] {
    border: none;
    background: #9B2243;
    color: #fff;
}

    .btn-pastilla:hover:not(:disabled)[b-h5hga1oyjs] {
        background: #780E3F;
    }

    .btn-pastilla:disabled[b-h5hga1oyjs] {
        opacity: .6;
        cursor: default;
    }

.btn-pastilla-outline[b-h5hga1oyjs] {
    border: 2px solid #DCD3C4;
    background: transparent;
    color: #780E3F;
}

    .btn-pastilla-outline:hover:not(:disabled)[b-h5hga1oyjs] {
        border-color: #9B2243;
        background: #FBF6EF;
    }

    .btn-pastilla-outline:disabled[b-h5hga1oyjs] {
        opacity: .6;
        cursor: default;
    }

.btn-pastilla-outline--sm[b-h5hga1oyjs] {
    font-size: 13px;
    padding: 7px 16px;
    min-height: 36px;
}

.form-grid[b-h5hga1oyjs] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 14px;
}

.campo[b-h5hga1oyjs] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.campo--ancho[b-h5hga1oyjs] {
    grid-column: span 2;
}

.campo-label[b-h5hga1oyjs] {
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #645C50;
}

.pill-input[b-h5hga1oyjs] {
    font: inherit;
    font-size: 16px;
    padding: 13px 18px;
    border-radius: 999px;
    border: 1px solid #DCD3C4;
    background: #F9F4ED;
    color: #2e2b25;
    min-height: 48px;
    width: 100%;
    min-width: 0;
}

    .pill-input:focus[b-h5hga1oyjs] {
        outline: none;
        border-color: #9B2243;
    }

.check-linea[b-h5hga1oyjs] {
    display: flex;
    gap: 12px;
    align-items: center;
    font-size: 16px;
    cursor: pointer;
    margin-top: 12px;
}

    .check-linea input[type=checkbox][b-h5hga1oyjs] {
        width: 22px;
        height: 22px;
        accent-color: #9B2243;
    }

.form-botones[b-h5hga1oyjs] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 20px;
}

/* Clave generada (VC-083): se muestra una sola vez, estilo "API key" — monoespaciada, separada
   visualmente del resto para que no se confunda con un campo editable. */
.clave-aviso[b-h5hga1oyjs] {
    font-size: 15px;
    color: #645C50;
    margin: 0 0 16px;
}

.clave-caja[b-h5hga1oyjs] {
    background: #2e2b25;
    color: #F9F4ED;
    border-radius: 14px;
    padding: 16px 18px;
    overflow-x: auto;
}

    .clave-caja code[b-h5hga1oyjs] {
        font-family: ui-monospace, "Cascadia Code", "Consolas", monospace;
        font-size: 15px;
        letter-spacing: .02em;
        white-space: pre;
    }

@media (max-width: 640px) {
    .lista-encabezado[b-h5hga1oyjs] {
        display: none;
    }

    .dispositivo-row[b-h5hga1oyjs] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .col-codigo[b-h5hga1oyjs], .col-lugar[b-h5hga1oyjs], .col-asignado[b-h5hga1oyjs], .col-contacto[b-h5hga1oyjs], .col-estatus[b-h5hga1oyjs], .col-acciones[b-h5hga1oyjs] {
        flex: 1 1 auto;
        width: 100%;
        display: block;
        text-align: left;
    }

    .col-acciones[b-h5hga1oyjs] {
        display: flex;
        justify-content: flex-start;
    }

    .col-lugar[b-h5hga1oyjs]::before, .col-asignado[b-h5hga1oyjs]::before, .col-contacto[b-h5hga1oyjs]::before, .col-estatus[b-h5hga1oyjs]::before {
        display: block;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: #A19786;
        margin-bottom: 3px;
    }

    .col-lugar[b-h5hga1oyjs]::before {
        content: "Lugar";
    }

    .col-asignado[b-h5hga1oyjs]::before {
        content: "Asignado a";
    }

    .col-contacto[b-h5hga1oyjs]::before {
        content: "Último contacto";
    }

    .col-estatus[b-h5hga1oyjs]::before {
        content: "Estatus";
    }

    .form-grid[b-h5hga1oyjs] {
        grid-template-columns: 1fr;
    }

    .campo--ancho[b-h5hga1oyjs] {
        grid-column: span 1;
    }
}
/* /Pages/Integrantes/Index.razor.rz.scp.css */
.encabezado[b-6j2zxaw8dl] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.titulo[b-6j2zxaw8dl] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-weight: 400;
    font-size: clamp(28px, 4vw, 42px);
    line-height: 1.1;
    margin: 0 0 6px;
    color: #780E3F;
}

.subtitulo[b-6j2zxaw8dl] {
    margin: 0 0 1.5rem;
    font-size: 17px;
    color: #645C50;
}

.lista-card[b-6j2zxaw8dl] {
    background: #fff;
    border-radius: 28px;
    padding: 10px;
    box-shadow: 0 1px 2px rgba(46, 43, 37, .14);
}

.lista-encabezado[b-6j2zxaw8dl], .integrante-row[b-6j2zxaw8dl] {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
}

.lista-encabezado[b-6j2zxaw8dl] {
    padding: 16px 18px 10px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #A19786;
}

.integrante-row[b-6j2zxaw8dl] {
    padding: 16px 18px;
    border-top: 1px solid #EEE7DB;
}

.col-integrante[b-6j2zxaw8dl] {
    flex: 1 1 160px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.integrante-nombre[b-6j2zxaw8dl] {
    font-size: 16px;
    font-weight: 700;
}

.col-cargo[b-6j2zxaw8dl] {
    flex: 0 0 130px;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: #A19786;
}

.col-orden[b-6j2zxaw8dl] {
    flex: 0 0 70px;
    font-size: 16px;
    color: #645C50;
}

.col-estatus[b-6j2zxaw8dl] {
    flex: 0 0 90px;
    display: flex;
    justify-content: flex-end;
}

.col-acciones[b-6j2zxaw8dl] {
    flex: 0 0 170px;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

/* VC-042: por debajo de 640px las columnas de ancho fijo no caben — cada renglón pasa de fila a
   tarjeta apilada, una columna por línea con su propia etiqueta (excepto .col-integrante, que ya
   hace de encabezado de la tarjeta, y .col-acciones, que no necesita etiqueta). */
@media (max-width: 640px) {
    .lista-encabezado[b-6j2zxaw8dl] {
        display: none;
    }

    .integrante-row[b-6j2zxaw8dl] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .col-integrante[b-6j2zxaw8dl], .col-cargo[b-6j2zxaw8dl], .col-orden[b-6j2zxaw8dl], .col-estatus[b-6j2zxaw8dl], .col-acciones[b-6j2zxaw8dl] {
        flex: 1 1 auto;
        width: 100%;
    }

    .col-cargo[b-6j2zxaw8dl], .col-orden[b-6j2zxaw8dl], .col-estatus[b-6j2zxaw8dl] {
        display: block;
        text-align: left;
    }

    .col-acciones[b-6j2zxaw8dl] {
        display: flex;
        justify-content: flex-start;
    }

    .col-cargo[b-6j2zxaw8dl]::before, .col-orden[b-6j2zxaw8dl]::before, .col-estatus[b-6j2zxaw8dl]::before {
        content: "Cargo";
        display: block;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: #A19786;
        margin-bottom: 3px;
    }

    .col-orden[b-6j2zxaw8dl]::before {
        content: "Orden";
    }

    .col-estatus[b-6j2zxaw8dl]::before {
        content: "Estatus";
    }
}

.chip-estatus[b-6j2zxaw8dl] {
    font-size: 13px;
    font-weight: 800;
    padding: 6px 14px;
    border-radius: 999px;
}

.chip-estatus--activo[b-6j2zxaw8dl] {
    background: #E8F0E7;
    color: #2F5334;
}

.chip-estatus--inactivo[b-6j2zxaw8dl] {
    background: #EEE7DB;
    color: #645C50;
}

.suplencia-nota[b-6j2zxaw8dl] {
    font-size: 15px;
    color: #645C50;
}

.btn-pastilla[b-6j2zxaw8dl], .btn-pastilla-outline[b-6j2zxaw8dl] {
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    padding: 10px 20px;
    border-radius: 999px;
    cursor: pointer;
    min-height: 44px;
}

.btn-pastilla[b-6j2zxaw8dl] {
    border: none;
    background: #9B2243;
    color: #fff;
}

    .btn-pastilla:hover:not(:disabled)[b-6j2zxaw8dl] {
        background: #780E3F;
    }

    .btn-pastilla:disabled[b-6j2zxaw8dl] {
        opacity: .6;
        cursor: default;
    }

.btn-pastilla-outline[b-6j2zxaw8dl] {
    border: 2px solid #DCD3C4;
    background: transparent;
    color: #780E3F;
}

    .btn-pastilla-outline:hover:not(:disabled)[b-6j2zxaw8dl] {
        border-color: #9B2243;
        background: #FBF6EF;
    }

    .btn-pastilla-outline:disabled[b-6j2zxaw8dl] {
        opacity: .6;
        cursor: default;
    }

.btn-pastilla-outline--sm[b-6j2zxaw8dl] {
    font-size: 13px;
    padding: 7px 16px;
    min-height: 36px;
}

.form-grid[b-6j2zxaw8dl] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 14px;
}

.campo[b-6j2zxaw8dl] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.campo-label[b-6j2zxaw8dl] {
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #645C50;
}

.pill-input[b-6j2zxaw8dl] {
    font: inherit;
    font-size: 16px;
    padding: 13px 18px;
    border-radius: 999px;
    border: 1px solid #DCD3C4;
    background: #F9F4ED;
    color: #2e2b25;
    min-height: 48px;
    width: 100%;
    min-width: 0;
}

    .pill-input:focus[b-6j2zxaw8dl] {
        outline: none;
        border-color: #9B2243;
    }

.check-linea[b-6j2zxaw8dl] {
    display: flex;
    gap: 12px;
    align-items: center;
    font-size: 16px;
    cursor: pointer;
}

    .check-linea input[type=checkbox][b-6j2zxaw8dl] {
        width: 22px;
        height: 22px;
        accent-color: #9B2243;
    }

.form-botones[b-6j2zxaw8dl] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 20px;
}

/* VC-049: el @media de VC-042 arriba solo cubre la lista — el formulario de alta/edición de
   integrante (dentro del modal) nunca recibió su propio tratamiento responsivo. Por debajo de
   640px, todos los campos del .form-grid pasan a una sola columna ("col 12"). */
@media (max-width: 640px) {
    .form-grid[b-6j2zxaw8dl] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Sesiones/Detalle.razor.rz.scp.css */
/* Tokens y componentes reutilizados a mano de Index.razor.css (archivos scoped separados,
   sin conflicto) — VC-020. */

.sesion-card[b-gtsnfr8cjc] {
    background: #fff;
    border-radius: 28px;
    padding: 26px;
    box-shadow: 0 3px 10px rgba(46, 43, 37, .10);
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-bottom: 1.5rem;
}

.sesion-encabezado[b-gtsnfr8cjc] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.chips-fila[b-gtsnfr8cjc] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.chip-estado[b-gtsnfr8cjc], .chip-punto[b-gtsnfr8cjc], .chip-folio[b-gtsnfr8cjc], .chip-asistencia[b-gtsnfr8cjc] {
    display: inline-flex;
    align-items: center;
    font-size: 13px;
    font-weight: 800;
    padding: 7px 15px;
    border-radius: 999px;
    white-space: nowrap;
}

.chip-folio[b-gtsnfr8cjc] {
    background: #F9F4ED;
    color: #645C50;
}

.chip-estado--PROGRAMADA[b-gtsnfr8cjc], .chip-punto--PENDIENTE[b-gtsnfr8cjc], .chip-punto--RETIRADO[b-gtsnfr8cjc] {
    background: #EEE7DB;
    color: #645C50;
}

.chip-estado--EN_CURSO[b-gtsnfr8cjc] {
    background: #F7E3E8;
    color: #780E3F;
}

.chip-estado--CERRADA[b-gtsnfr8cjc], .chip-punto--APROBADO[b-gtsnfr8cjc], .chip-punto--ATENDIDO[b-gtsnfr8cjc] {
    background: #E8F0E7;
    color: #2F5334;
}

.chip-estado--CANCELADA[b-gtsnfr8cjc], .chip-punto--RECHAZADO[b-gtsnfr8cjc] {
    background: #F7E0DE;
    color: #8A2620;
}

.chip-punto--EN_VOTACION[b-gtsnfr8cjc] {
    background: #F3E4C6;
    color: #8C5A12;
}

.chip-asistencia--presente[b-gtsnfr8cjc] {
    background: #E8F0E7;
    color: #3C6642;
}

.chip-asistencia--ausente[b-gtsnfr8cjc] {
    background: #EEE7DB;
    color: #645C50;
}

.sesion-titulo[b-gtsnfr8cjc] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-weight: 400;
    font-size: clamp(26px, 3.4vw, 36px);
    line-height: 1.12;
    margin: 0 0 8px;
    color: #2e2b25;
}

.sesion-meta[b-gtsnfr8cjc] {
    margin: 0;
    font-size: 17px;
    color: #645C50;
}

.quorum-card[b-gtsnfr8cjc] {
    border-radius: 20px;
    padding: 20px;
    display: flex;
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
}

.quorum-card--ok[b-gtsnfr8cjc] {
    background: #E8F0E7;
}

    .quorum-card--ok .quorum-num[b-gtsnfr8cjc], .quorum-card--ok .quorum-de[b-gtsnfr8cjc], .quorum-card--ok .quorum-texto[b-gtsnfr8cjc] {
        color: #2F5334;
    }

    .quorum-card--ok .quorum-barra-fill[b-gtsnfr8cjc] {
        background: #2F5334;
    }

.quorum-card--warn[b-gtsnfr8cjc] {
    background: #F3E4C6;
}

    .quorum-card--warn .quorum-num[b-gtsnfr8cjc], .quorum-card--warn .quorum-de[b-gtsnfr8cjc], .quorum-card--warn .quorum-texto[b-gtsnfr8cjc] {
        color: #7A5A28;
    }

    .quorum-card--warn .quorum-barra-fill[b-gtsnfr8cjc] {
        background: #7A5A28;
    }

.quorum-num[b-gtsnfr8cjc] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-size: 38px;
    line-height: 1;
}

.quorum-de[b-gtsnfr8cjc] {
    font-size: 17px;
    font-weight: 600;
}

.quorum-texto[b-gtsnfr8cjc] {
    flex: 1 1 220px;
    min-width: 0;
    font-size: 17px;
}

.quorum-barra[b-gtsnfr8cjc] {
    flex: 1 1 180px;
    min-width: 120px;
    height: 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .6);
    overflow: hidden;
    display: flex;
}

.acciones-fila[b-gtsnfr8cjc] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.btn-pastilla[b-gtsnfr8cjc], .btn-pastilla-outline[b-gtsnfr8cjc] {
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    border-radius: 999px;
    cursor: pointer;
    min-height: 48px;
    padding: 13px 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    text-decoration: none;
    border: none;
}

.btn-pastilla[b-gtsnfr8cjc], a.btn-pastilla[b-gtsnfr8cjc] {
    background: #9B2243;
    color: #fff;
}

    .btn-pastilla:hover:not(:disabled)[b-gtsnfr8cjc], a.btn-pastilla:hover[b-gtsnfr8cjc] {
        background: #780E3F;
        color: #fff;
    }

    .btn-pastilla:disabled[b-gtsnfr8cjc] {
        opacity: .6;
        cursor: default;
    }

.btn-pastilla-outline[b-gtsnfr8cjc], a.btn-pastilla-outline[b-gtsnfr8cjc] {
    background: transparent;
    border: 2px solid #DCD3C4;
    color: #645C50;
    padding: 11px 24px;
}

    .btn-pastilla-outline:hover:not(:disabled)[b-gtsnfr8cjc], a.btn-pastilla-outline:hover[b-gtsnfr8cjc] {
        border-color: #9B2243;
        color: #780E3F;
    }

    .btn-pastilla-outline:disabled[b-gtsnfr8cjc] {
        opacity: .6;
        cursor: default;
    }

.btn-pastilla-outline--sm[b-gtsnfr8cjc] {
    font-size: 15px;
    padding: 9px 20px;
    min-height: 44px;
}

.btn-pastilla-outline--peligro[b-gtsnfr8cjc] {
    border-color: #A8322B;
    color: #8A2620;
}

    .btn-pastilla-outline--peligro:hover:not(:disabled)[b-gtsnfr8cjc] {
        border-color: #8A2620;
        color: #8A2620;
    }

.btn-pastilla-outline--verde:hover:not(:disabled)[b-gtsnfr8cjc] {
    border-color: #4A7B50;
    color: #3C6642;
}

.documentos-card[b-gtsnfr8cjc] {
    background: #F9F4ED;
    border: 1px solid #DCD3C4;
    border-radius: 20px;
    padding: 20px;
    display: flex;
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
}

.documentos-texto[b-gtsnfr8cjc] {
    flex: 1 1 240px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

    .documentos-texto strong[b-gtsnfr8cjc] {
        font-size: 17px;
        font-weight: 800;
    }

    .documentos-texto span[b-gtsnfr8cjc] {
        font-size: 15px;
        color: #645C50;
    }

.documentos-botones[b-gtsnfr8cjc] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.detalle-grid[b-gtsnfr8cjc] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 18px;
    align-items: start;
}

.columna[b-gtsnfr8cjc] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.columna-encabezado[b-gtsnfr8cjc] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

    .columna-encabezado h2[b-gtsnfr8cjc] {
        margin: 0;
        font-size: 21px;
        font-weight: 800;
    }

.columna-encabezado-nota[b-gtsnfr8cjc] {
    font-size: 15px;
    color: #645C50;
}

.lista-card[b-gtsnfr8cjc] {
    background: #fff;
    border-radius: 28px;
    box-shadow: 0 1px 2px rgba(46, 43, 37, .14);
    padding: 8px;
}

.asistencia-row[b-gtsnfr8cjc] {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 14px 16px;
    border-radius: 20px;
}

.asistencia-info[b-gtsnfr8cjc] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

    .asistencia-info strong[b-gtsnfr8cjc] {
        font-size: 16px;
        font-weight: 700;
    }

.asistencia-cargo[b-gtsnfr8cjc] {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: #A19786;
}

.asistencia-nota[b-gtsnfr8cjc] {
    font-size: 14px;
    color: #645C50;
    font-style: italic;
}

.switch[b-gtsnfr8cjc] {
    flex: 0 0 auto;
    position: relative;
    display: inline-flex;
    cursor: pointer;
}

    .switch input[b-gtsnfr8cjc] {
        position: absolute;
        opacity: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        cursor: pointer;
    }

.switch-pista[b-gtsnfr8cjc] {
    width: 52px;
    height: 30px;
    border-radius: 999px;
    background: #DCD3C4;
    padding: 3px;
    display: flex;
    align-items: center;
    transition: background .15s ease;
}

.switch-perilla[b-gtsnfr8cjc] {
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(46, 43, 37, .28);
    transition: transform .15s ease;
}

.switch input:checked + .switch-pista[b-gtsnfr8cjc] {
    background: #4A7B50;
}

    .switch input:checked + .switch-pista .switch-perilla[b-gtsnfr8cjc] {
        transform: translateX(22px);
    }

.switch--suplencia input:checked + .switch-pista[b-gtsnfr8cjc] {
    background: #9B2243;
}

.switch-label[b-gtsnfr8cjc] {
    font-size: 13px;
    color: #645C50;
}

.firma-card[b-gtsnfr8cjc] {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 1px 2px rgba(46, 43, 37, .14);
    display: flex;
    flex-direction: column;
    gap: 14px;
}

    .firma-card h2[b-gtsnfr8cjc] {
        margin: 0;
        font-size: 21px;
        font-weight: 800;
    }

.firma-ayuda[b-gtsnfr8cjc] {
    margin: 0;
    font-size: 15px;
    color: #645C50;
}

.firma-lienzo[b-gtsnfr8cjc] {
    border: 2px dashed #DCD3C4;
    border-radius: 20px;
    background: #fff;
    padding: 8px;
    display: flex;
    justify-content: center;
}

    .firma-lienzo canvas[b-gtsnfr8cjc] {
        touch-action: none;
        background: #fff;
        max-width: 100%;
    }

.firma-botones[b-gtsnfr8cjc] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.lista-firmantes[b-gtsnfr8cjc] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

    .lista-firmantes li[b-gtsnfr8cjc] {
        display: flex;
        align-items: baseline;
        gap: 8px;
        flex-wrap: wrap;
    }

.lista-firmantes--pendiente li strong[b-gtsnfr8cjc] {
    color: #9B2243;
}

.form-grid[b-gtsnfr8cjc] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 14px;
}

.campo[b-gtsnfr8cjc] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.campo--ancho[b-gtsnfr8cjc] {
    grid-column: span 2;
}

.campo-label[b-gtsnfr8cjc] {
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #645C50;
}

/* InputText/InputSelect/InputNumber/InputCheckbox son componentes hijo de Blazor: el CSS
   aislado de este archivo no llega al <input>/<select> real sin ::deep (misma trampa que
   NavMenu.razor.css y VC-017/018/019). ::deep no lleva un selector propio delante (no depende
   de .form-card, VC-036: el formulario ahora vive dentro de Shared/Modal.razor) - sigue
   aplicando a cualquier .pill-input en el árbol renderizado de este componente, sin importar
   cuántos componentes intermedios (EditForm, Modal) haya de por medio. */
[b-gtsnfr8cjc] .pill-input {
    font: inherit;
    font-size: 16px;
    padding: 13px 18px;
    border-radius: 999px;
    border: 1px solid #DCD3C4;
    background: #F9F4ED;
    color: #2e2b25;
    min-height: 48px;
    width: 100%;
    min-width: 0;
}

    [b-gtsnfr8cjc] .pill-input:focus {
        outline: none;
        border-color: #9B2243;
    }

.form-botones[b-gtsnfr8cjc] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 20px;
}

.form-checks[b-gtsnfr8cjc] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.check-linea[b-gtsnfr8cjc] {
    display: flex;
    gap: 12px;
    align-items: center;
    font-size: 16px;
    cursor: pointer;
}

    .check-linea[b-gtsnfr8cjc]  input[type=checkbox] {
        width: 22px;
        height: 22px;
        accent-color: #9B2243;
    }

.punto-card[b-gtsnfr8cjc] {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 1px 2px rgba(46, 43, 37, .14);
    display: flex;
    flex-direction: column;
    gap: 14px;
    border: 2px solid transparent;
    margin-bottom: 14px;
}

.punto-card--en-votacion[b-gtsnfr8cjc] {
    border-color: #E9D3A6;
}

.punto-encabezado[b-gtsnfr8cjc] {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.punto-num[b-gtsnfr8cjc] {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 999px;
    background: #F9F4ED;
    color: #645C50;
    font-size: 17px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}

.punto-titulo[b-gtsnfr8cjc] {
    flex: 1 1 180px;
    min-width: 0;
    font-size: 18px;
    font-weight: 700;
    margin: 0;
    line-height: 1.35;
}

.punto-tramite[b-gtsnfr8cjc] {
    margin: 0;
    font-size: 15px;
    color: #A19786;
    font-style: italic;
}

.votacion-card[b-gtsnfr8cjc] {
    background: #FFF7E8;
    border: 1px solid #E9D3A6;
    border-radius: 20px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.votacion-fila[b-gtsnfr8cjc] {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
}

.votacion-cuenta[b-gtsnfr8cjc] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-size: 30px;
    line-height: 1;
    color: #8C5A12;
}

.votacion-texto[b-gtsnfr8cjc] {
    flex: 1 1 160px;
    min-width: 0;
    font-size: 15px;
    color: #7A5A28;
    font-weight: 600;
}

.tally-chips[b-gtsnfr8cjc] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.tally-chip[b-gtsnfr8cjc] {
    background: #fff;
    border-radius: 999px;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 700;
    color: #2e2b25;
}

.voto-actual[b-gtsnfr8cjc] {
    margin: 0;
    font-size: 15px;
    color: #645C50;
}

.confirmar-voto-card[b-gtsnfr8cjc] {
    background: #fff;
    border: 2px solid #9B2243;
    border-radius: 20px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    font-size: 17px;
}

.confirmar-voto-botones[b-gtsnfr8cjc] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.voto-opciones[b-gtsnfr8cjc] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.btn-voto[b-gtsnfr8cjc] {
    flex: 1 1 150px;
    border: none;
    cursor: pointer;
    font: inherit;
    font-size: 17px;
    font-weight: 800;
    padding: 16px 20px;
    border-radius: 20px;
    min-height: 56px;
    color: #fff;
}

    .btn-voto:disabled[b-gtsnfr8cjc] {
        opacity: .6;
        cursor: default;
    }

.btn-voto--favor[b-gtsnfr8cjc] {
    background: #4A7B50;
}

.btn-voto--contra[b-gtsnfr8cjc] {
    background: #A8322B;
}

.btn-voto--abstencion[b-gtsnfr8cjc] {
    background: #82796A;
}

.resultado-bloque[b-gtsnfr8cjc] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.resultado-mayoria[b-gtsnfr8cjc] {
    margin: 0;
    font-size: 15px;
    color: #645C50;
}

.barra[b-gtsnfr8cjc] {
    display: flex;
    height: 14px;
    border-radius: 999px;
    overflow: hidden;
    background: #EEE7DB;
}

.barra-favor[b-gtsnfr8cjc] {
    background: #4A7B50;
}

.barra-contra[b-gtsnfr8cjc] {
    background: #A8322B;
}

.barra-abst[b-gtsnfr8cjc] {
    background: #C0B6A5;
}

.barra-leyenda[b-gtsnfr8cjc] {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    font-size: 15px;
    color: #2e2b25;
}

    .barra-leyenda span[b-gtsnfr8cjc] {
        display: flex;
        align-items: center;
        gap: 8px;
    }

.barra-dot[b-gtsnfr8cjc] {
    width: 12px;
    height: 12px;
    border-radius: 999px;
    flex: 0 0 auto;
}

.barra-dot--favor[b-gtsnfr8cjc] {
    background: #4A7B50;
}

.barra-dot--contra[b-gtsnfr8cjc] {
    background: #A8322B;
}

.barra-dot--abst[b-gtsnfr8cjc] {
    background: #C0B6A5;
}

/* VC-049: los formularios de "Editar sesión" y "Agregar/Editar punto" nunca recibieron el
   tratamiento responsivo que sí tuvo la lista en VC-042. Por debajo de 640px, todos los campos
   del .form-grid pasan a una sola columna ("col 12"), sin excepciones. */
@media (max-width: 640px) {
    .form-grid[b-gtsnfr8cjc] {
        grid-template-columns: 1fr;
    }

    .campo--ancho[b-gtsnfr8cjc] {
        grid-column: span 1;
    }
}

/* VC-069: controles para subir/bajar un punto del orden del día — objetivos táctiles de 44px. */
.punto-acciones[b-gtsnfr8cjc] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.btn-mover[b-gtsnfr8cjc] {
    width: 44px;
    height: 44px;
    border-radius: 999px;
    border: 2px solid #DCD3C4;
    background: transparent;
    color: #780E3F;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
}

    .btn-mover:hover:not(:disabled)[b-gtsnfr8cjc] {
        border-color: #9B2243;
        background: #FBF6EF;
    }

    .btn-mover:disabled[b-gtsnfr8cjc] {
        opacity: .6;
        cursor: default;
    }
/* /Pages/Sesiones/Index.razor.rz.scp.css */
.encabezado[b-3p5ytbwh39] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.btn-pastilla[b-3p5ytbwh39] {
    border: none;
    background: #9B2243;
    color: #fff;
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    padding: 14px 26px;
    border-radius: 999px;
    cursor: pointer;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

    .btn-pastilla:hover:not(:disabled)[b-3p5ytbwh39] {
        background: #780E3F;
    }

    .btn-pastilla:disabled[b-3p5ytbwh39] {
        opacity: .65;
        cursor: default;
    }

.form-grid[b-3p5ytbwh39] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}

.campo[b-3p5ytbwh39] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.campo--ancho[b-3p5ytbwh39] {
    grid-column: span 2;
}

.campo-label[b-3p5ytbwh39] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #645C50;
}

    .campo-label svg[b-3p5ytbwh39] {
        flex: none;
        color: #B08A98;
    }

.pill-input[b-3p5ytbwh39] {
    font: inherit;
    font-size: 16px;
    padding: 13px 18px;
    border-radius: 999px;
    border: 1.5px solid #DCD3C4;
    background: #F9F4ED;
    color: #2e2b25;
    min-height: 48px;
    width: 100%;
    min-width: 0;
    transition: border-color .12s ease, box-shadow .12s ease;
}

    .pill-input:focus[b-3p5ytbwh39] {
        outline: none;
        border-color: #9B2243;
        box-shadow: 0 0 0 3px rgba(155, 34, 67, .14);
    }

.form-botones[b-3p5ytbwh39] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 20px;
}

.btn-pastilla-outline[b-3p5ytbwh39] {
    border: 1.5px solid #DCD3C4;
    background: transparent;
    color: #780E3F;
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    padding: 14px 26px;
    border-radius: 999px;
    cursor: pointer;
    min-height: 48px;
}

    .btn-pastilla-outline:hover[b-3p5ytbwh39] {
        border-color: #9B2243;
        background: #FBF6EF;
    }

.cifras-grid[b-3p5ytbwh39] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 14px;
    margin-bottom: 1.5rem;
}

.stat-card[b-3p5ytbwh39] {
    background: #fff;
    border-radius: 20px;
    padding: 20px;
    box-shadow: 0 1px 2px rgba(46, 43, 37, .14);
}

.stat-num[b-3p5ytbwh39] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-size: 34px;
    line-height: 1;
}

.stat-label[b-3p5ytbwh39] {
    font-size: 15px;
    color: #645C50;
    margin-top: 6px;
}

.lista-card[b-3p5ytbwh39] {
    background: #fff;
    border-radius: 28px;
    padding: 10px 10px 6px;
    box-shadow: 0 1px 2px rgba(46, 43, 37, .14);
}

.lista-encabezado[b-3p5ytbwh39], .sesion-row[b-3p5ytbwh39] {
    display: flex;
    gap: 14px;
    align-items: center;
}

.lista-encabezado[b-3p5ytbwh39] {
    padding: 16px 18px 10px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #A19786;
}

.sesion-row[b-3p5ytbwh39] {
    width: 100%;
    text-align: left;
    font: inherit;
    border: none;
    background: transparent;
    border-top: 1px solid #EEE7DB;
    cursor: pointer;
    padding: 16px 18px;
    flex-wrap: wrap;
    border-radius: 20px;
    min-height: 48px;
}

    .sesion-row:hover[b-3p5ytbwh39] {
        background: #FBF6EF;
    }

.col-sesion[b-3p5ytbwh39] {
    flex: 0 0 120px;
    font-size: 16px;
    font-weight: 800;
    color: #2e2b25;
}

.sesion-tipo[b-3p5ytbwh39] {
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #A19786;
}

.col-titulo[b-3p5ytbwh39] {
    flex: 1 1 170px;
    min-width: 0;
    font-size: 16px;
    color: #2e2b25;
}

.col-fecha[b-3p5ytbwh39] {
    flex: 0 0 128px;
    font-size: 15px;
    color: #645C50;
}

.col-puntos[b-3p5ytbwh39], .col-presentes[b-3p5ytbwh39] {
    flex: 0 0 65px;
    text-align: center;
    font-size: 16px;
    color: #645C50;
}

.col-presentes[b-3p5ytbwh39] {
    flex-basis: 85px;
}

.col-estado[b-3p5ytbwh39] {
    flex: 0 0 140px;
    display: flex;
    justify-content: flex-end;
}

.chip-estado[b-3p5ytbwh39] {
    font-size: 13px;
    font-weight: 800;
    padding: 7px 15px;
    border-radius: 999px;
    white-space: nowrap;
}

.chip-estado--PROGRAMADA[b-3p5ytbwh39] {
    background: #EEE7DB;
    color: #645C50;
}

.chip-estado--EN_CURSO[b-3p5ytbwh39] {
    background: #F7E3E8;
    color: #780E3F;
}

.chip-estado--CERRADA[b-3p5ytbwh39] {
    background: #E8F0E7;
    color: #2F5334;
}

.chip-estado--CANCELADA[b-3p5ytbwh39] {
    background: #F7E0DE;
    color: #8A2620;
}

/* VC-042: por debajo de 640px las columnas de ancho fijo no caben — cada renglón pasa de fila a
   tarjeta apilada, una columna por línea con su propia etiqueta (excepto .col-sesion, que ya
   hace de encabezado de la tarjeta). */
@media (max-width: 640px) {
    .lista-encabezado[b-3p5ytbwh39] {
        display: none;
    }

    .sesion-row[b-3p5ytbwh39] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .col-sesion[b-3p5ytbwh39], .col-titulo[b-3p5ytbwh39], .col-fecha[b-3p5ytbwh39], .col-puntos[b-3p5ytbwh39], .col-presentes[b-3p5ytbwh39], .col-estado[b-3p5ytbwh39] {
        flex: 1 1 auto;
        width: 100%;
        display: block;
        text-align: left;
    }

    .col-titulo[b-3p5ytbwh39]::before, .col-fecha[b-3p5ytbwh39]::before, .col-puntos[b-3p5ytbwh39]::before, .col-presentes[b-3p5ytbwh39]::before, .col-estado[b-3p5ytbwh39]::before {
        content: "Título";
        display: block;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: #A19786;
        margin-bottom: 3px;
    }

    .col-fecha[b-3p5ytbwh39]::before {
        content: "Fecha";
    }

    .col-puntos[b-3p5ytbwh39]::before {
        content: "Puntos";
    }

    .col-presentes[b-3p5ytbwh39]::before {
        content: "Presentes";
    }

    .col-estado[b-3p5ytbwh39]::before {
        content: "Estado";
    }
}

/* VC-049: el @media de VC-042 arriba solo cubre la lista — el formulario de "Convocar sesión"
   (dentro del modal) nunca recibió su propio tratamiento responsivo. Por debajo de 640px, todos
   los campos del .form-grid pasan a una sola columna ("col 12"), sin excepciones. */
@media (max-width: 640px) {
    .form-grid[b-3p5ytbwh39] {
        grid-template-columns: 1fr;
    }

    .campo--ancho[b-3p5ytbwh39] {
        grid-column: span 1;
    }
}
/* /Pages/Sesiones/Pantalla.razor.rz.scp.css */
/*
 * VC-081: rediseño completo pensado para proyectarse en un monitor/proyector de 50" — lienzo de
 * referencia fijo de 1920x1080 (docs/diseno/pantalla-monitoreo-rediseno.dc.html) que se agranda
 * o encoge completo según el tamaño de la ventana (pantallaEscala.js aplica transform: scale()
 * al elemento con id="pantalla-stage"), no un reflow de columnas como el resto del sitio. Todos
 * los valores de este archivo están en px "de lienzo" (1920x1080), tal como los definió el
 * diseño — se ven correctos porque el elemento completo se escala como una unidad.
 */

@keyframes pulso-b-omglb4zhom {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.4); opacity: .5; }
}

.pantalla-fondo[b-omglb4zhom] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #2a1019;
}

.pantalla-stage[b-omglb4zhom] {
    flex: 0 0 auto;
    width: 1920px;
    height: 1080px;
    transform-origin: center center;
    background: #f5ead8;
    display: flex;
    flex-direction: column;
    font-family: 'Figtree', system-ui, sans-serif;
    color: #2e2b25;
    overflow: hidden;
}

.pantalla-flex[b-omglb4zhom] {
    flex: 1;
}

/* — barra superior — */

.pantalla-barra[b-omglb4zhom] {
    flex: 0 0 56px;
    background-image: linear-gradient(90deg, #780E3F 0%, #9B2243 100%);
    color: #fff;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 0 36px;
}

.pantalla-volver[b-omglb4zhom] {
    color: #fff;
    font: inherit;
    font-size: 18px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    border: none;
    cursor: pointer;
}

    .pantalla-volver:hover[b-omglb4zhom] {
        background: rgba(255, 255, 255, .22);
    }

.pantalla-municipio[b-omglb4zhom] {
    font-size: 17px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .8);
}

.pantalla-envivo[b-omglb4zhom] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.pantalla-pulso[b-omglb4zhom] {
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: #9FD4A5;
    animation: pulso-b-omglb4zhom 1.6s ease-in-out infinite;
}

.pantalla-reloj[b-omglb4zhom] {
    font-size: 26px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    min-width: 90px;
    text-align: right;
}

/* — cuerpo — */

.pantalla-cuerpo[b-omglb4zhom] {
    flex: 1;
    min-height: 0;
    padding: 20px 36px 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.pantalla-encabezado[b-omglb4zhom] {
    flex: 0 0 auto;
    display: flex;
    gap: 28px;
    align-items: center;
}

.encabezado-escudo[b-omglb4zhom] {
    height: 80px;
    width: auto;
    flex: 0 0 auto;
}

.encabezado-info[b-omglb4zhom] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.encabezado-chips[b-omglb4zhom] {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.encabezado-fecha[b-omglb4zhom] {
    font-size: 21px;
    color: #645C50;
    font-weight: 600;
}

.encabezado-titulo[b-omglb4zhom] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-size: 46px;
    line-height: 1.02;
    color: #780E3F;
}

.chip-estado[b-omglb4zhom], .chip-punto[b-omglb4zhom], .chip-folio[b-omglb4zhom] {
    display: inline-flex;
    align-items: center;
    font-size: 20px;
    font-weight: 800;
    padding: 7px 18px;
    border-radius: 999px;
    white-space: nowrap;
}

.chip-folio[b-omglb4zhom] {
    background: #fff;
    color: #645C50;
}

.chip-estado--PROGRAMADA[b-omglb4zhom], .chip-punto--PENDIENTE[b-omglb4zhom], .chip-punto--RETIRADO[b-omglb4zhom] {
    background: #EEE7DB;
    color: #645C50;
}

.chip-estado--EN_CURSO[b-omglb4zhom] {
    background: #F7E3E8;
    color: #780E3F;
}

.chip-estado--CERRADA[b-omglb4zhom], .chip-punto--APROBADO[b-omglb4zhom], .chip-punto--ATENDIDO[b-omglb4zhom] {
    background: #E8F0E7;
    color: #2F5334;
}

.chip-estado--CANCELADA[b-omglb4zhom], .chip-punto--RECHAZADO[b-omglb4zhom] {
    background: #F7E0DE;
    color: #8A2620;
}

.chip-punto--EN_VOTACION[b-omglb4zhom] {
    background: #F3E4C6;
    color: #8C5A12;
}

/* — quórum — */

.quorum-card[b-omglb4zhom] {
    flex: 0 0 600px;
    border-radius: 28px;
    padding: 14px 24px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.quorum-card--ok[b-omglb4zhom] {
    background: #E8F0E7;
}

    .quorum-card--ok .quorum-num[b-omglb4zhom], .quorum-card--ok .quorum-de[b-omglb4zhom], .quorum-card--ok .quorum-texto[b-omglb4zhom], .quorum-card--ok .quorum-minimo[b-omglb4zhom] {
        color: #2F5334;
    }

    .quorum-card--ok .quorum-barra-fill[b-omglb4zhom] {
        background: #2F5334;
    }

.quorum-card--warn[b-omglb4zhom] {
    background: #F3E4C6;
}

    .quorum-card--warn .quorum-num[b-omglb4zhom], .quorum-card--warn .quorum-de[b-omglb4zhom], .quorum-card--warn .quorum-texto[b-omglb4zhom], .quorum-card--warn .quorum-minimo[b-omglb4zhom] {
        color: #7A5A28;
    }

    .quorum-card--warn .quorum-barra-fill[b-omglb4zhom] {
        background: #7A5A28;
    }

.quorum-fila[b-omglb4zhom] {
    display: flex;
    align-items: baseline;
    gap: 12px;
}

.quorum-num[b-omglb4zhom] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-size: 54px;
    line-height: .9;
}

.quorum-de[b-omglb4zhom] {
    font-size: 23px;
    font-weight: 700;
    white-space: nowrap;
}

.quorum-texto[b-omglb4zhom] {
    font-size: 22px;
    font-weight: 800;
    white-space: nowrap;
}

.quorum-fila-barra[b-omglb4zhom] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.quorum-barra[b-omglb4zhom] {
    flex: 1;
    position: relative;
    height: 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .7);
    overflow: hidden;
}

.quorum-barra-fill[b-omglb4zhom] {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    border-radius: 999px;
}

.quorum-barra-marca[b-omglb4zhom] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 3px;
    background: #2e2b25;
    opacity: .55;
}

.quorum-minimo[b-omglb4zhom] {
    flex: 0 0 auto;
    font-size: 17px;
    font-weight: 700;
    white-space: nowrap;
}

/* — grid principal (pase de lista + columna derecha) — */

.pantalla-grid-diseno[b-omglb4zhom] {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: 940px minmax(0, 1fr);
    gap: 24px;
}

.vacio[b-omglb4zhom] {
    color: #645C50;
    font-size: 18px;
}

/* — pase de lista — */

.lista-panel[b-omglb4zhom] {
    min-height: 0;
    background: #fff;
    border-radius: 32px;
    box-shadow: 0 3px 10px rgba(46, 43, 37, .10);
    padding: 22px 22px 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.lista-encabezado[b-omglb4zhom] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0 6px;
}

.lista-titulo[b-omglb4zhom], .orden-titulo[b-omglb4zhom] {
    flex: 0 0 auto;
    white-space: nowrap;
    font-size: 30px;
    font-weight: 800;
}

.lista-resumen-item[b-omglb4zhom] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 20px;
    font-weight: 700;
    color: #2e2b25;
}

.lista-resumen-punto[b-omglb4zhom] {
    width: 14px;
    height: 14px;
    border-radius: 999px;
}

.lista-grid[b-omglb4zhom] {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-flow: column;
    gap: 8px 12px;
}

.asistencia-fila[b-omglb4zhom] {
    /* VC-081/-qa: el diseño original tampoco recortaba este texto (ni el mockup ni la primera
       versión de esta pantalla) — con nombres cortos de muestra nunca se notó, pero con datos
       reales (41 activos, filas muy bajas) un nombre de 2 líneas medía más que su fila y se
       superponía visualmente con la siguiente. overflow: hidden convierte cada fila en su propia
       caja de recorte: lo que no quepa en la altura que le tocó (repeat(N, minmax(0,1fr))) se
       recorta ahí mismo, nunca sobre la fila vecina. */
    overflow: hidden;
    min-height: 0;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 14px;
    border-radius: 18px;
    border-left: 6px solid transparent;
}

.asistencia-num[b-omglb4zhom] {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 999px;
    color: #fff;
    font-size: 17px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}

.asistencia-fila--densa .asistencia-num[b-omglb4zhom] {
    width: 30px;
    height: 30px;
}

.asistencia-fila--muy-densa .asistencia-num[b-omglb4zhom] {
    width: 24px;
    height: 24px;
    font-size: 13px;
}

.asistencia-textos[b-omglb4zhom] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.asistencia-nombre[b-omglb4zhom] {
    font-size: 23px;
    font-weight: 700;
    line-height: 1.12;
    text-wrap: balance;
    /* Mismo respaldo que .orden-titulo-fila: como máximo 2 líneas, con "…" en vez de invadir la
       fila de al lado si el nombre no cabe ni reduciendo la fuente (ver overflow arriba). */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.asistencia-fila--densa .asistencia-nombre[b-omglb4zhom] {
    font-size: 19px;
}

.asistencia-fila--muy-densa .asistencia-nombre[b-omglb4zhom] {
    font-size: 15px;
    line-height: 1.05;
}

.asistencia-detalle[b-omglb4zhom] {
    display: flex;
    gap: 8px;
    align-items: baseline;
    flex-wrap: wrap;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
    line-height: 1.15;
}

.asistencia-fila--densa .asistencia-detalle[b-omglb4zhom] {
    font-size: 12px;
}

.asistencia-fila--muy-densa .asistencia-detalle[b-omglb4zhom] {
    font-size: 10px;
}

.asistencia-cargo[b-omglb4zhom] {
    color: #A19786;
}

/* — columna derecha: punto en curso + orden del día — */

.derecha-panel[b-omglb4zhom] {
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.hero-card[b-omglb4zhom] {
    flex: 0 0 auto;
    border-radius: 32px;
    padding: 22px 30px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    box-shadow: 0 12px 32px rgba(46, 43, 37, .14);
    min-width: 0;
}

.hero-card--vacio[b-omglb4zhom] {
    background: #fff;
    color: #645C50;
    font-size: 22px;
    font-weight: 600;
    align-items: center;
    justify-content: center;
    min-height: 120px;
}

.hero-fila-superior[b-omglb4zhom] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.hero-kicker[b-omglb4zhom] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 18px;
    border-radius: 999px;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.hero-kicker-punto[b-omglb4zhom] {
    width: 12px;
    height: 12px;
    border-radius: 999px;
    animation: pulso-b-omglb4zhom 1.2s ease-in-out infinite;
}

.hero-sub[b-omglb4zhom] {
    font-size: 21px;
    font-weight: 700;
    opacity: .85;
}

.hero-cuenta-bloque[b-omglb4zhom] {
    display: flex;
    align-items: baseline;
    gap: 10px;
}

.hero-cuenta-etiqueta[b-omglb4zhom] {
    font-size: 18px;
    font-weight: 700;
    opacity: .8;
}

.hero-cuenta[b-omglb4zhom] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-size: 56px;
    line-height: .9;
    font-variant-numeric: tabular-nums;
}

.hero-resultado-pill[b-omglb4zhom] {
    background: #fff;
    color: #2F5334;
    font-size: 26px;
    font-weight: 800;
    padding: 10px 26px;
    border-radius: 999px;
}

.hero-titulo[b-omglb4zhom] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-size: 34px;
    line-height: 1.12;
    text-wrap: pretty;
}

.hero-desglose[b-omglb4zhom], .hero-oculto[b-omglb4zhom], .hero-espera[b-omglb4zhom] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 14px;
    justify-content: flex-end;
}

.hero-tally[b-omglb4zhom] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.hero-tally-item[b-omglb4zhom] {
    background: rgba(255, 255, 255, .14);
    border-radius: 22px;
    padding: 10px 18px;
    display: flex;
    align-items: baseline;
    gap: 12px;
}

.hero-tally-valor[b-omglb4zhom] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-size: 50px;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.hero-tally-label[b-omglb4zhom] {
    font-size: 20px;
    font-weight: 800;
}

.hero-barra[b-omglb4zhom] {
    display: flex;
    height: 18px;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(255, 255, 255, .28);
}

.hero-barra-favor[b-omglb4zhom] {
    background: #6FB076;
}

.hero-barra-contra[b-omglb4zhom] {
    background: #E0675D;
}

.hero-barra-abst[b-omglb4zhom] {
    background: #D8CFC0;
}

.hero-barra-participacion[b-omglb4zhom] {
    background: #fff;
}

.hero-oculto-fila[b-omglb4zhom] {
    display: flex;
    align-items: baseline;
    gap: 18px;
}

.hero-oculto-num[b-omglb4zhom] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-size: 80px;
    line-height: .9;
    font-variant-numeric: tabular-nums;
}

.hero-oculto-texto[b-omglb4zhom] {
    font-size: 32px;
    font-weight: 800;
}

.hero-oculto-nota[b-omglb4zhom] {
    font-size: 20px;
    font-weight: 600;
    opacity: .85;
}

.hero-espera-desc[b-omglb4zhom] {
    margin: 0;
    font-size: 24px;
    line-height: 1.5;
    color: #645C50;
    max-width: 52ch;
}

.hero-espera-pill[b-omglb4zhom] {
    align-self: flex-start;
    background: #F9F4ED;
    color: #645C50;
    font-size: 21px;
    font-weight: 800;
    padding: 10px 22px;
    border-radius: 999px;
}

/* — orden del día — */

.orden-panel[b-omglb4zhom] {
    flex: 1;
    min-height: 0;
    background: #fff;
    border-radius: 32px;
    box-shadow: 0 3px 10px rgba(46, 43, 37, .10);
    padding: 20px 22px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.orden-encabezado[b-omglb4zhom] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 6px;
}

.orden-avance[b-omglb4zhom] {
    font-size: 20px;
    font-weight: 700;
    color: #645C50;
}

.orden-grid[b-omglb4zhom] {
    flex: 1;
    min-height: 0;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
}

.orden-fila[b-omglb4zhom] {
    min-height: 0;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 4px 14px;
    border-radius: 18px;
    background: #fff;
    border: 2px solid transparent;
}

.orden-fila--resaltada[b-omglb4zhom] {
    background: #FBF1F3;
    border-color: #9B2243;
}

.orden-fila--retirado[b-omglb4zhom] {
    background: #FAF6F0;
}

    .orden-fila--retirado .orden-titulo-fila[b-omglb4zhom] {
        color: #A19786;
    }

.orden-num[b-omglb4zhom] {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    background: #F9F4ED;
    color: #645C50;
    font-size: 18px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}

.orden-fila--resaltada .orden-num[b-omglb4zhom] {
    background: #9B2243;
    color: #fff;
}

.orden-titulo-fila[b-omglb4zhom] {
    flex: 1;
    min-width: 0;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.15;
    color: #2e2b25;
    text-wrap: pretty;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.orden-detalle[b-omglb4zhom] {
    flex: 0 0 150px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
}

    .orden-detalle .chip-punto[b-omglb4zhom] {
        font-size: 16px;
        padding: 4px 14px;
    }

.orden-conteo[b-omglb4zhom] {
    font-size: 15px;
    font-weight: 700;
    color: #645C50;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
/* /Pages/Usuarios/Index.razor.rz.scp.css */
.encabezado[b-a2ermolxpg] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.titulo[b-a2ermolxpg] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-weight: 400;
    font-size: clamp(28px, 4vw, 42px);
    line-height: 1.1;
    margin: 0 0 6px;
    color: #780E3F;
}

.subtitulo[b-a2ermolxpg] {
    margin: 0 0 1.5rem;
    font-size: 17px;
    color: #645C50;
}

.lista-card[b-a2ermolxpg] {
    background: #fff;
    border-radius: 28px;
    padding: 10px;
    box-shadow: 0 1px 2px rgba(46, 43, 37, .14);
}

.lista-encabezado[b-a2ermolxpg], .usuario-row[b-a2ermolxpg] {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
}

.lista-encabezado[b-a2ermolxpg] {
    padding: 16px 18px 10px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #A19786;
}

.usuario-row[b-a2ermolxpg] {
    padding: 16px 18px;
    border-top: 1px solid #EEE7DB;
}

.col-usuario[b-a2ermolxpg] {
    flex: 0 0 150px;
    font-size: 16px;
    font-weight: 800;
    color: #2e2b25;
}

.col-nombre[b-a2ermolxpg] {
    flex: 1 1 125px;
    min-width: 0;
    font-size: 16px;
}

.col-rol[b-a2ermolxpg] {
    flex: 0 0 135px;
}

.col-integrante[b-a2ermolxpg] {
    flex: 1 1 125px;
    min-width: 0;
    font-size: 16px;
    color: #645C50;
}

.col-estatus[b-a2ermolxpg] {
    flex: 0 0 95px;
    display: flex;
    justify-content: flex-end;
}

.col-acciones[b-a2ermolxpg] {
    flex: 0 0 auto;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.chip-rol[b-a2ermolxpg] {
    background: #F7E3E8;
    color: #780E3F;
    font-size: 13px;
    font-weight: 800;
    padding: 6px 14px;
    border-radius: 999px;
}

.chip-estatus[b-a2ermolxpg] {
    font-size: 13px;
    font-weight: 800;
    padding: 6px 14px;
    border-radius: 999px;
}

.chip-estatus--activo[b-a2ermolxpg] {
    background: #E8F0E7;
    color: #2F5334;
}

.chip-estatus--inactivo[b-a2ermolxpg] {
    background: #EEE7DB;
    color: #645C50;
}

.btn-pastilla[b-a2ermolxpg], .btn-pastilla-outline[b-a2ermolxpg] {
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    padding: 10px 20px;
    border-radius: 999px;
    cursor: pointer;
    min-height: 44px;
}

.btn-pastilla[b-a2ermolxpg] {
    border: none;
    background: #9B2243;
    color: #fff;
}

    .btn-pastilla:hover:not(:disabled)[b-a2ermolxpg] {
        background: #780E3F;
    }

    .btn-pastilla:disabled[b-a2ermolxpg] {
        opacity: .6;
        cursor: default;
    }

.btn-pastilla-outline[b-a2ermolxpg] {
    border: 2px solid #DCD3C4;
    background: transparent;
    color: #780E3F;
}

    .btn-pastilla-outline:hover:not(:disabled)[b-a2ermolxpg] {
        border-color: #9B2243;
        background: #FBF6EF;
    }

    .btn-pastilla-outline:disabled[b-a2ermolxpg] {
        opacity: .6;
        cursor: default;
    }

.btn-pastilla-outline--sm[b-a2ermolxpg] {
    font-size: 13px;
    padding: 7px 16px;
    min-height: 36px;
}

.form-grid[b-a2ermolxpg] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 14px;
}

.campo[b-a2ermolxpg] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.campo--ancho[b-a2ermolxpg] {
    grid-column: span 2;
}

/* Agrupa dos campos en un solo renglón dentro de un .campo--ancho (VC-039: Usuario +
   Contraseña), sin depender de la paridad de cuántos campos vinieron antes en el .form-grid. */
.fila-doble[b-a2ermolxpg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.campo-label[b-a2ermolxpg] {
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #645C50;
}

.pill-input[b-a2ermolxpg] {
    font: inherit;
    font-size: 16px;
    padding: 13px 18px;
    border-radius: 999px;
    border: 1px solid #DCD3C4;
    background: #F9F4ED;
    color: #2e2b25;
    min-height: 48px;
    width: 100%;
    min-width: 0;
}

    .pill-input:focus[b-a2ermolxpg] {
        outline: none;
        border-color: #9B2243;
    }

    .pill-input:disabled[b-a2ermolxpg] {
        opacity: .7;
        cursor: not-allowed;
    }

.check-linea[b-a2ermolxpg] {
    display: flex;
    gap: 12px;
    align-items: center;
    font-size: 16px;
    cursor: pointer;
}

    .check-linea input[type=checkbox][b-a2ermolxpg] {
        width: 22px;
        height: 22px;
        accent-color: #9B2243;
    }

.form-botones[b-a2ermolxpg] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 20px;
}

/* VC-042: por debajo de 640px las columnas de ancho fijo no caben — cada renglón pasa de fila a
   tarjeta apilada, una columna por línea con su propia etiqueta (excepto .col-usuario, que ya
   hace de encabezado de la tarjeta, y .col-acciones, que no necesita etiqueta). */
@media (max-width: 640px) {
    .lista-encabezado[b-a2ermolxpg] {
        display: none;
    }

    .usuario-row[b-a2ermolxpg] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .col-usuario[b-a2ermolxpg], .col-nombre[b-a2ermolxpg], .col-rol[b-a2ermolxpg], .col-integrante[b-a2ermolxpg], .col-estatus[b-a2ermolxpg], .col-acciones[b-a2ermolxpg] {
        flex: 1 1 auto;
        width: 100%;
        display: block;
        text-align: left;
    }

    .col-acciones[b-a2ermolxpg] {
        display: flex;
        justify-content: flex-start;
    }

    .col-nombre[b-a2ermolxpg]::before, .col-rol[b-a2ermolxpg]::before, .col-integrante[b-a2ermolxpg]::before, .col-estatus[b-a2ermolxpg]::before {
        content: "Nombre";
        display: block;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: #A19786;
        margin-bottom: 3px;
    }

    .col-rol[b-a2ermolxpg]::before {
        content: "Rol";
    }

    .col-integrante[b-a2ermolxpg]::before {
        content: "Integrante";
    }

    .col-estatus[b-a2ermolxpg]::before {
        content: "Estatus";
    }
}

/* VC-049: el @media de VC-042 arriba solo cubre la lista — el formulario de alta/edición de
   usuario (dentro del modal) nunca recibió su propio tratamiento responsivo. Por debajo de
   640px, todos los campos del .form-grid pasan a una sola columna ("col 12"), incluidos los
   agrupamientos explícitos (Rol/Integrante ligado vía .campo--ancho, Usuario/Contraseña vía
   .fila-doble de VC-039) — sin excepciones. */
@media (max-width: 640px) {
    .form-grid[b-a2ermolxpg] {
        grid-template-columns: 1fr;
    }

    .campo--ancho[b-a2ermolxpg] {
        grid-column: span 1;
    }

    .fila-doble[b-a2ermolxpg] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Usuarios/Rostro.razor.rz.scp.css */
/* Mismos tokens visuales que Usuarios/Index.razor.css (VC-021/VC-083) — CSS aislado por Blazor. */

.encabezado[b-2o03ny36p0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.titulo[b-2o03ny36p0] {
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-weight: 400;
    font-size: clamp(26px, 4vw, 38px);
    line-height: 1.1;
    margin: 0 0 6px;
    color: #780E3F;
}

.subtitulo[b-2o03ny36p0] {
    margin: 0;
    font-size: 16px;
    color: #645C50;
}

.tarjeta[b-2o03ny36p0] {
    background: #fff;
    border-radius: 24px;
    padding: 22px;
    box-shadow: 0 1px 2px rgba(46, 43, 37, .14);
    margin-bottom: 18px;
}

.tarjeta-titulo[b-2o03ny36p0] {
    font-size: 19px;
    font-weight: 800;
    color: #2e2b25;
    margin: 0 0 12px;
}

.tarjeta-texto[b-2o03ny36p0] {
    font-size: 15px;
    color: #645C50;
    margin: 0 0 16px;
}

.chip-estatus[b-2o03ny36p0] {
    font-size: 13px;
    font-weight: 800;
    padding: 6px 14px;
    border-radius: 999px;
    margin-right: 10px;
}

.chip-estatus--activo[b-2o03ny36p0] {
    background: #E8F0E7;
    color: #2F5334;
}

.chip-estatus--inactivo[b-2o03ny36p0] {
    background: #EEE7DB;
    color: #645C50;
}

.btn-pastilla[b-2o03ny36p0], .btn-pastilla-outline[b-2o03ny36p0] {
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    padding: 10px 20px;
    border-radius: 999px;
    cursor: pointer;
    min-height: 44px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
}

.btn-pastilla[b-2o03ny36p0] {
    border: none;
    background: #9B2243;
    color: #fff;
}

    .btn-pastilla:hover:not(:disabled)[b-2o03ny36p0] {
        background: #780E3F;
    }

    .btn-pastilla:disabled[b-2o03ny36p0] {
        opacity: .6;
        cursor: default;
    }

.btn-pastilla-outline[b-2o03ny36p0] {
    border: 2px solid #DCD3C4;
    background: transparent;
    color: #780E3F;
}

    .btn-pastilla-outline:hover:not(:disabled)[b-2o03ny36p0] {
        border-color: #9B2243;
        background: #FBF6EF;
    }

    .btn-pastilla-outline:disabled[b-2o03ny36p0] {
        opacity: .6;
        cursor: default;
    }

.btn-pastilla-outline--peligro[b-2o03ny36p0] {
    border-color: #A8322B;
    color: #8A2620;
}

    .btn-pastilla-outline--peligro:hover:not(:disabled)[b-2o03ny36p0] {
        border-color: #8A2620;
        color: #8A2620;
    }

.confirmar-baja[b-2o03ny36p0] {
    background: #FBEEEC;
    border-radius: 16px;
    padding: 16px;
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: 15px;
    color: #6E241D;
}

.campo[b-2o03ny36p0] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
    max-width: 220px;
    margin-bottom: 12px;
}

.campo-label[b-2o03ny36p0] {
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #645C50;
}

.pill-input[b-2o03ny36p0] {
    font: inherit;
    font-size: 16px;
    padding: 13px 18px;
    border-radius: 999px;
    border: 1px solid #DCD3C4;
    background: #F9F4ED;
    color: #2e2b25;
    min-height: 48px;
    width: 100%;
    min-width: 0;
}

    .pill-input:focus[b-2o03ny36p0] {
        outline: none;
        border-color: #9B2243;
    }

    .pill-input:disabled[b-2o03ny36p0] {
        opacity: .7;
        cursor: not-allowed;
    }

.check-linea[b-2o03ny36p0] {
    display: flex;
    gap: 12px;
    align-items: center;
    font-size: 15px;
    cursor: pointer;
    margin-bottom: 16px;
}

    .check-linea input[type=checkbox][b-2o03ny36p0] {
        width: 22px;
        height: 22px;
        accent-color: #9B2243;
        flex: none;
    }

.form-botones[b-2o03ny36p0] {
    display: flex;
    justify-content: flex-start;
    gap: 10px;
    flex-wrap: wrap;
}

.consentimiento-ok[b-2o03ny36p0] {
    color: #2F5334;
    font-weight: 700;
    font-size: 15px;
    margin: 0;
}

.recomendaciones[b-2o03ny36p0] {
    margin: 0 0 16px;
    padding-left: 20px;
    color: #645C50;
    font-size: 15px;
}

    .recomendaciones li[b-2o03ny36p0] {
        margin-bottom: 4px;
    }

/* Captura con cámara (VC-087) */
.opciones-captura[b-2o03ny36p0] {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.camara-caja[b-2o03ny36p0] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
}

.camara-caja video[b-2o03ny36p0], .camara-previa img[b-2o03ny36p0] {
    width: 100%;
    max-width: 480px;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 16px;
    background: #2e2b25;
}

/* Espejo solo en el video en vivo (más natural para encuadrarse) — la foto ya capturada se
   muestra sin espejar, igual a como se manda a la API. */
.camara-caja video[b-2o03ny36p0] {
    transform: scaleX(-1);
}

.camara-previa[b-2o03ny36p0] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.resultados-fotos[b-2o03ny36p0] {
    list-style: none;
    margin: 14px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.resultado-ok[b-2o03ny36p0], .resultado-error[b-2o03ny36p0] {
    font-size: 14px;
    padding: 8px 14px;
    border-radius: 12px;
}

.resultado-ok[b-2o03ny36p0] {
    background: #E8F0E7;
    color: #2F5334;
}

.resultado-error[b-2o03ny36p0] {
    background: #FBEEEC;
    color: #8A2620;
}
/* /Shared/Modal.razor.rz.scp.css */
.modal-overlay[b-1755lfw3un] {
    position: fixed;
    inset: 0;
    background: rgba(40, 12, 24, .55);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 5vh 16px;
    overflow-y: auto;
    z-index: 1000;
    outline: none;
    animation: modal-overlay-entrada-b-1755lfw3un .15s ease-out;
}

@keyframes modal-overlay-entrada-b-1755lfw3un {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.modal-tarjeta[b-1755lfw3un] {
    background: #fff;
    border-radius: 28px;
    width: 100%;
    max-width: 640px;
    box-shadow: 0 20px 50px rgba(30, 10, 20, .35);
    animation: modal-tarjeta-entrada-b-1755lfw3un .18s ease-out;
}

@keyframes modal-tarjeta-entrada-b-1755lfw3un {
    from {
        opacity: 0;
        transform: translateY(-12px) scale(.98);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.modal-encabezado[b-1755lfw3un] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 24px 26px 0;
}

.modal-titulo[b-1755lfw3un] {
    margin: 0;
    font-family: 'Caprasimo', system-ui, sans-serif;
    font-weight: 400;
    font-size: 24px;
    color: #780E3F;
}

.modal-cerrar[b-1755lfw3un] {
    flex: none;
    width: 38px;
    height: 38px;
    border-radius: 999px;
    border: none;
    background: #F7E3E8;
    color: #780E3F;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

    .modal-cerrar:hover[b-1755lfw3un] {
        background: #EFC9D3;
    }

.modal-cuerpo[b-1755lfw3un] {
    padding: 20px 26px 26px;
}
