@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.25o87uqmvr.bundle.scp.css';

/* _content/WizeAdmin/Components/Layout/LanguageSelector.razor.rz.scp.css */
/* REQ-WCC-103 — selector de idioma, visualmente consistente con .top-bar-actions
   (misma familia de tokens que el resto del top-bar: MainLayout.razor.css). */
.language-selector[b-wtknvcx3ok] {
    display: flex;
    align-items: center;
    gap: var(--space-2, 0.5rem);
    font-size: var(--text-sm, 0.875rem);
}

.language-option[b-wtknvcx3ok] {
    background: none;
    border: none;
    padding: 2px 4px;
    color: var(--color-text-secondary);
    font-weight: 500;
    cursor: pointer;
    border-radius: var(--radius-md, 4px);
    line-height: 1;
}

.language-option:hover[b-wtknvcx3ok] {
    color: var(--color-primary);
}

.language-option.active[b-wtknvcx3ok] {
    color: var(--color-primary);
    font-weight: 700;
}

.language-option:focus-visible[b-wtknvcx3ok] {
    outline: 2px solid var(--color-primary-light, var(--color-primary));
    outline-offset: 2px;
}

.language-separator[b-wtknvcx3ok] {
    color: var(--color-text-secondary);
    opacity: 0.5;
}
/* _content/WizeAdmin/Components/Layout/MainLayout.razor.rz.scp.css */
.dashboard-layout[b-fi3pv7tiiz] {
    display: flex;
    min-height: 100vh;
    width: 100%;
    background: var(--color-background);
    /* FBK-059 — token local para icons-only mode. 4rem (64px) cumple WCAG 2.1 AA
       touch target ≥ 44x44px y deja margen para iconos bi-* (18px) con padding. */
    --sidebar-width-icon: 4rem;
}

/* REQ-DS-05-BRAND-SYNC (2026-04-17): sidebar plano var(--sidebar) (MFT canonical).
   Era: linear-gradient(--color-primary → --color-primary-dark) — rompia C1+C2.
   Motivo excepción §5 del prompt: este override rompe visualmente tras el
   cambio de tokens MFT (gradient tapaba el navy plano). Documentado. */
/* FBK-054 (2026-04-17): display:flex column para que el bloque usuario
   quede pegado al pie via flex:1 del .sidebar-nav. Paridad MFT canonical
   .sidebar (ver theme.css :285). No altera color, tokens ni gradient
   (REQ-DS-05-004 intacto). */
#sidebar[b-fi3pv7tiiz] {
    width: var(--sidebar-width);
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 1000;
    background: var(--sidebar);
    background-image: none;
    color: var(--color-text-inverse);
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    /* FBK-059 A2 (2026-04-17) — Técnica anti-reflow T1-lite.
       Sidebar ANIMA su width (smooth visual). El main-content y la top-bar
       NO transicionan (snap instantáneo), lo cual elimina el blast radius:
       las toolbars internas de Pruebas/Excepciones nunca ven anchos
       intermedios inconsistentes durante la animación. El ancho del sidebar
       es position:fixed, no participa del flujo de layout de #main-content,
       entonces animarlo no causa reflow del árbol principal. */
    transition: width var(--transition-base);
}

.top-bar[b-fi3pv7tiiz] {
    position: fixed;
    top: 0;
    right: 0;
    left: var(--sidebar-width);
    height: var(--topbar-height);
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
    display: flex;
    align-items: center;
    padding: 0 var(--space-5);
    color: var(--color-text);
    z-index: 999;
    /* FBK-059 A2 (2026-04-17) — NO transition sobre `left`.
       Cambiar `left` dispara layout del top-bar y descendientes (botones,
       selects, user-link). En icons-only, `left` salta de 240px→64px
       instantáneo. La sensación de smoothness la da el sidebar animando
       su propio width (position:fixed, no afecta al árbol de layout del
       main-content). */
}

.top-bar .bi-list[b-fi3pv7tiiz] {
    color: var(--color-text-secondary);
}

.top-bar-actions[b-fi3pv7tiiz] {
    margin-left: auto;
    display: flex;
    flex-wrap: nowrap;
    gap: var(--space-3);
    align-items: center;
    white-space: nowrap;
    min-width: 0;
}

.top-bar-actions .user-link[b-fi3pv7tiiz],
.top-bar-actions .btn-link[b-fi3pv7tiiz] {
    white-space: nowrap;
}

.top-bar-actions .form-select[b-fi3pv7tiiz] {
    max-width: 260px;
    min-width: 220px;
    background-color: var(--color-background);
    color: var(--color-text);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.top-bar-actions .form-select:focus[b-fi3pv7tiiz] {
    border-color: var(--color-primary-light);
    box-shadow: 0 0 0 3px var(--color-primary-subtle);
}

.top-bar-actions .bi[b-fi3pv7tiiz] {
    color: var(--color-text-secondary);
}

#main-content[b-fi3pv7tiiz] {
    margin-left: var(--sidebar-width);
    margin-top: var(--topbar-height);
    padding: var(--space-6);
    width: calc(100% - var(--sidebar-width));
    /* FBK-059 A2 (2026-04-17) — NO transition sobre `margin-left` ni `width`.
       Toda transition aquí cascadea reflow a las toolbars y forms dentro del
       main (blast radius que rompió Pruebas/Excepciones). El cambio es
       instantáneo; el sidebar da la ilusión de smooth vía transform. */
}

/* ============================================================
   FBK-059 — Modo icons-only (paridad MFT shadcn collapsible="icon")
   ============================================================
   Activado via clase .sidebar-icons-only en .dashboard-layout.
   Persiste en localStorage key "wcc-sidebar-icons-only" via SidebarStateService.
   Ancho 64px cumple WCAG 2.1 AA touch target ≥ 44x44.

   FBK-059 A2 (2026-04-17) — Técnica anti-reflow T1-lite:
   - #sidebar cambia width con transition (smooth visual).
   - .top-bar y #main-content cambian `left`/`margin-left`/`width` de forma
     INSTANTÁNEA (sin transition) — el snap elimina el estado de ancho
     intermedio que rompía el fix previo de toolbar de Pruebas/Excepciones.
   - Trade-off aceptado: hay un "gap visual" de ~150ms donde el sidebar
     (encogiéndose) deja un hueco transparente a su derecha hasta llegar a
     64px, mientras el main-content ya está posicionado en el ancho final.
     Es perceptible pero no disruptivo (el main-content vive sobre
     background neutro var(--color-background)). */
.sidebar-icons-only #sidebar[b-fi3pv7tiiz] {
    width: var(--sidebar-width-icon);
    /* FBK-059 iter 6 (Challenge 1 VP Ejecutivo):
       Override overflow-y:auto → visible en icons-only mode.
       Razón: en icons-only los items son iconos de ~40px altura, caben de sobra
       en 100vh. El scroll-y no aporta valor aquí, pero SI clippeaba el tooltip
       CSS-only (::after) que sale por el eje X a la derecha del icono.
       En modo expanded el overflow-y:auto original (línea ~30) se preserva —
       este override solo aplica bajo .sidebar-icons-only.
       Trade-off: si a futuro se agregan >20 items al sidebar, en icons-only
       con viewport < ~800px altura no habría scroll — riesgo bajo (hoy hay 8). */
    overflow: visible;
}

.sidebar-icons-only .top-bar[b-fi3pv7tiiz] {
    left: var(--sidebar-width-icon);
}

.sidebar-icons-only #main-content[b-fi3pv7tiiz] {
    margin-left: var(--sidebar-width-icon);
    width: calc(100% - var(--sidebar-width-icon));
}

/* Ocultar labels textuales en icons-only. Selector ::deep porque los elementos
   viven en NavMenu/NavGroup (scopes CSS distintos). Excluye .sidebar-avatar
   (Decisión B1 VP Ejecutivo: avatar siempre visible). */
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-group-label,
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-group-chevron,
.sidebar-icons-only[b-fi3pv7tiiz]  .sidebar-user-info,
.sidebar-icons-only[b-fi3pv7tiiz]  .sidebar-user-caret,
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-group-toggle-all span,
.sidebar-icons-only[b-fi3pv7tiiz]  .brand-separator,
.sidebar-icons-only[b-fi3pv7tiiz]  .brand-badge,
.sidebar-icons-only[b-fi3pv7tiiz]  .sidebar-brand-img {
    display: none;
}

/* En icons-only, el nav-link muestra solo el icono centrado.
   Labels de texto del NavItem ocultos via ::deep. */
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-link span:not(.nav-item-dot) {
    display: none;
}

.sidebar-icons-only[b-fi3pv7tiiz]  .nav-link {
    justify-content: center;
    padding: var(--space-2);
}

/* Toggle button en sidebar-brand — siempre visible, centrado en icons-only. */
.sidebar-icons-only[b-fi3pv7tiiz]  .sidebar-brand {
    justify-content: center;
    padding: var(--space-1) var(--space-2);
}

/* FBK-059 iter 5 — NavGroup header en icons-only mode.
   Con .nav-group-label y .nav-group-chevron ocultos, solo queda visible el
   .nav-group-icon (agregado iter 5). Alineamos el header a centro igual que
   .nav-link para paridad visual con el resto del sidebar. Sin esta regla el
   icono del group quedaria pegado al left-padding default del header. */
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-group-header {
    justify-content: center;
    padding: var(--space-2);
}

/* FBK-059 iter 5 — toggle-all "Colapsar todo/Expandir todo" oculto en icons-only.
   El button solo contiene un <span> con texto ya oculto por regla previa
   (.sidebar-icons-only ::deep .nav-group-toggle-all span). Sin esto, el button
   queda renderizado con altura + padding pero contenido vacio: genera un
   espacio fantasma entre Dashboard y el primer group. Ocultar entero. */
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-group-toggle-all {
    display: none;
}

/* ============================================================
   FBK-059 iter 6 — Tooltips on hover en icons-only mode (paridad MFT)
   ============================================================
   Decisión arquitectónica: Opción B (CSS-only con pseudo-elemento ::after)
   elegida sobre Opción C (Bootstrap JS Tooltip / Popper).
   Razones:
   - Cero JS: no toca lifecycle Blazor ni re-init en cada StateHasChanged.
   - Trigger nativo :hover (sin delay artificial del title="" del browser).
   - Control total del estilo para paridad MFT (navy bg, white text, arrow).
   - Scope preciso: SOLO bajo .sidebar-icons-only. En expanded mode el tooltip
     no existe (el label ya es visible → seria ruido, requerimiento CEO).

   BACKUP PLAN (si CEO pide pixel-match exacto MFT estilo Radix/framer-motion):
   Iter 7 puede migrar a Bootstrap Tooltip (data-bs-toggle="tooltip") o a una
   lib JS (Floating UI / Popper). Trade-off Bootstrap: lifecycle dispose+
   re-init en cada StateHasChanged de NavMenu (re-render del <button>); hay
   que hookear OnAfterRenderAsync para new bootstrap.Tooltip(el) después de
   cada render. CSS-only no tiene ese costo.

   Mecanismo: data-tooltip="@Label" en NavLink y nav-group-header → el
   contenido del tooltip sale via content: attr(data-tooltip).

   Overflow: #sidebar tiene overflow-y:auto (podria clippear el tooltip hacia
   la derecha). Resuelto con position:fixed en el pseudo + cálculo left via
   calc(var(--sidebar-width-icon) + gap). Así el tooltip escapa del sidebar
   sin tocar overflow del contenedor (no queremos romper scroll vertical del
   nav si crece).

   Accesibilidad: aria-label="@Label" agregado en NavLink/header para screen
   readers (el <span>@Label</span> queda display:none en icons-only).

   Color: var(--color-wize-navy-dark) = oklch(0.18 0.04 230). Deliberadamente
   UN paso más oscuro que --sidebar (0.20) para que el tooltip "flote" sobre
   el sidebar con contraste sutil — si usáramos --sidebar exacto, el tooltip
   visualmente se fundiría con el sidebar cuando aparece pegado a su derecha.
   Evita magic number hardcoded (antes #0f1e3a) y resolverse via design
   token previene drift OKLCH vs HEX (ref: discovery brand-sync). */

.sidebar-icons-only[b-fi3pv7tiiz]  .nav-link[data-tooltip],
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-group-header[data-tooltip] {
    position: relative;
}

/* Tooltip body — ::after con content desde data-tooltip */
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-link[data-tooltip]::after,
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-group-header[data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    left: calc(100% + var(--space-2));
    top: 50%;
    transform: translateY(-50%) translateX(-4px);
    background: var(--color-wize-navy-dark);
    color: #ffffff;
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: 500;
    white-space: nowrap;
    letter-spacing: 0.01em;
    box-shadow: var(--shadow-md);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 1100;
    transition: opacity 0.15s ease-out, transform 0.15s ease-out, visibility 0s linear 0.15s;
}

/* Arrow — ::before triángulo apuntando al icono */
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-link[data-tooltip]::before,
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-group-header[data-tooltip]::before {
    content: "";
    position: absolute;
    left: calc(100% + var(--space-2) - 5px);
    top: 50%;
    transform: translateY(-50%) translateX(-4px);
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-right: 5px solid var(--color-wize-navy-dark);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 1100;
    transition: opacity 0.15s ease-out, transform 0.15s ease-out, visibility 0s linear 0.15s;
}

/* Hover trigger — aparece con slide-in lateral */
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-link[data-tooltip]:hover::after,
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-link[data-tooltip]:focus-visible::after,
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-group-header[data-tooltip]:hover::after,
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-group-header[data-tooltip]:focus-visible::after,
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-link[data-tooltip]:hover::before,
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-link[data-tooltip]:focus-visible::before,
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-group-header[data-tooltip]:hover::before,
.sidebar-icons-only[b-fi3pv7tiiz]  .nav-group-header[data-tooltip]:focus-visible::before {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) translateX(0);
    transition: opacity 0.15s ease-out, transform 0.15s ease-out, visibility 0s linear 0s;
}

/* Salvaguardia: NO mostrar tooltip en modo expanded (el label ya es visible).
   Por especificidad, las reglas arriba ya estan gated por .sidebar-icons-only,
   pero hacemos explicito el reset de data-tooltip fuera de icons-only para
   blindar contra regresion si alguien agrega [data-tooltip] en otro scope. */
.dashboard-layout:not(.sidebar-icons-only)[b-fi3pv7tiiz]  .nav-link[data-tooltip]::after,
.dashboard-layout:not(.sidebar-icons-only)[b-fi3pv7tiiz]  .nav-link[data-tooltip]::before,
.dashboard-layout:not(.sidebar-icons-only)[b-fi3pv7tiiz]  .nav-group-header[data-tooltip]::after,
.dashboard-layout:not(.sidebar-icons-only)[b-fi3pv7tiiz]  .nav-group-header[data-tooltip]::before {
    content: none;
    display: none;
}

.user-link[b-fi3pv7tiiz] {
    color: var(--color-text);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 6px;
}

.user-link:hover[b-fi3pv7tiiz] {
    color: var(--color-primary);
}

.top-bar-actions .btn-link[b-fi3pv7tiiz] {
    color: var(--color-text-secondary);
    text-decoration: none;
}

.top-bar-actions .btn-link:hover[b-fi3pv7tiiz] {
    color: var(--color-danger);
}

@media (max-width: 992px) {
    #sidebar[b-fi3pv7tiiz] {
        width: 240px;
    }

    .top-bar[b-fi3pv7tiiz] {
        left: 240px;
    }

    #main-content[b-fi3pv7tiiz] {
        margin-left: 240px;
        width: calc(100% - 240px);
    }
}

#blazor-error-ui[b-fi3pv7tiiz] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-fi3pv7tiiz] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/WizeAdmin/Components/Layout/NavGroup.razor.rz.scp.css */
/* FBK-058 — Scoped styles para NavGroup. Tokens canonicos WCC/MFT
   (--color-accent, --text-xs, --space-*, --transition-fast, --radius-md). */

.nav-group[b-m9u6h74dnz] {
    display: flex;
    flex-direction: column;
    margin-bottom: var(--space-1);
}

.nav-group-principal[b-m9u6h74dnz] {
    /* Grupo sin header — items directos al top del sidebar-nav. */
    margin-bottom: var(--space-2);
}

.nav-group-header[b-m9u6h74dnz] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    width: 100%;
    padding: var(--space-3) var(--space-4);
    margin-top: var(--space-2);
    background: transparent;
    border: 0;
    border-radius: var(--radius-md);
    color: rgba(255, 255, 255, 0.35);
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-align: left;
    cursor: pointer;
    transition: color var(--transition-fast), background var(--transition-fast);
}

.nav-group-header:hover[b-m9u6h74dnz] {
    color: rgba(255, 255, 255, 0.55);
    background: rgba(255, 255, 255, 0.04);
}

.nav-group-header:focus-visible[b-m9u6h74dnz] {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
}

.nav-group-label[b-m9u6h74dnz] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* FBK-059 iter 5 — icono representativo del grupo (paridad MFT icons-only).
   Tamaño alineado con ::deep .nav-link i (18px) para consistencia visual entre
   header del group y items anidados. Opacity reducida respecto al icono de item
   para reforzar jerarquía header vs. leaf. */
.nav-group-icon[b-m9u6h74dnz] {
    width: 18px;
    text-align: center;
    font-size: var(--text-base);
    opacity: 0.7;
    flex-shrink: 0;
}

.nav-group-chevron[b-m9u6h74dnz] {
    font-size: var(--text-xs);
    opacity: 0.7;
    transition: transform 200ms var(--transition-fast);
    transform: rotate(0deg);
}

.nav-group-chevron.collapsed[b-m9u6h74dnz] {
    transform: rotate(-90deg);
}

.nav-group-dot[b-m9u6h74dnz] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--color-accent);
    margin-right: var(--space-2);
    flex-shrink: 0;
}

.nav-group-items[b-m9u6h74dnz] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: max-height 200ms var(--transition-fast);
}

.nav-group-items[data-collapsed="true"][b-m9u6h74dnz] {
    display: none;
}

/* FBK-059 — regla .nav-group-toggle-all MOVIDA a NavMenu.razor.css.
   Root cause: el <button class="nav-group-toggle-all"> se renderiza en
   NavMenu.razor (scope b-0g49peg1wb), pero esta regla tenia scope de
   NavGroup (b-843njd57m0). El selector nunca matcheaba → button caía en
   user-agent default (rgb(240,240,240) fondo gris). Evidencia empírica
   Fase 1 FBK-059 (wcc-sidebar-pre-rebuild.json).
   La regla ahora vive en el archivo del componente dueño del HTML. */
/* _content/WizeAdmin/Components/Layout/NavMenu.razor.rz.scp.css */
/* FBK-055 (FBK-BLOCK-2026-04-17): sidebar-brand alineado a baseline MFT.
   Altura contenedor = --topbar-height (56px, ya canonical). Padding lateral
   y gap via tokens. El logo usa --brand-logo-height (24px) — antes 38px
   hardcoded, drift "un poquito" reportado por CEO. */
.sidebar-brand[b-8q0m3il0fi] {
    padding: var(--space-1) var(--space-5);
    min-height: var(--topbar-height);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: var(--brand-logo-gap);
}

/* FBK-059 iter 3 — toggle icons-only a la IZQUIERDA del logo (paridad MFT/WEP/OBP).
   Orden flex natural: [button] | [logo] | [separator] | [badge].
   Iter 2 usaba margin-left:auto para empujar al final — REMOVIDO.
   El gap del container (var(--brand-logo-gap)) se encarga del espaciado. */
.sidebar-collapse-toggle[b-8q0m3il0fi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: var(--radius-md);
    color: rgba(255, 255, 255, 0.6);
    cursor: pointer;
    transition: color var(--transition-fast), background var(--transition-fast);
}

.sidebar-collapse-toggle:hover[b-8q0m3il0fi] {
    color: var(--color-text-inverse);
    background: rgba(255, 255, 255, 0.08);
}

.sidebar-collapse-toggle:focus-visible[b-8q0m3il0fi] {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
}

.sidebar-collapse-toggle i[b-8q0m3il0fi] {
    font-size: var(--text-base);
}

.sidebar-brand-img[b-8q0m3il0fi] {
    height: var(--brand-logo-height);
    width: var(--brand-logo-width);
    object-fit: contain;
    display: block;
}

.brand-separator[b-8q0m3il0fi] {
    height: 1rem;
    width: 1px;
    background: rgba(255, 255, 255, 0.2);
}

.brand-badge[b-8q0m3il0fi] {
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    color: #C5A55A;
    text-transform: uppercase;
}

.sidebar-nav[b-8q0m3il0fi] {
    padding: var(--space-4) var(--space-2) var(--space-8);
}

.nav-section-label[b-8q0m3il0fi] {
    padding: var(--space-3) var(--space-4);
    margin-top: var(--space-2);
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(255, 255, 255, 0.35);
}

[b-8q0m3il0fi] .nav-link {
    color: rgba(255, 255, 255, 0.68);
    border: none;
    border-radius: var(--radius-md);
    min-height: 2.4rem;
    display: flex;
    align-items: center;
    gap: var(--space-2);
    width: 100%;
    text-decoration: none;
    margin: 1px 0;
    padding: var(--space-2) var(--space-3);
    position: relative;
    font-size: var(--text-sm);
    transition: all var(--transition-fast);
    background: transparent;
}

[b-8q0m3il0fi] .nav-link:hover {
    background: rgba(255, 255, 255, 0.08);
    color: var(--color-text-inverse);
}

[b-8q0m3il0fi] .nav-link.active {
    background: rgba(255, 255, 255, 0.14);
    color: var(--color-text-inverse);
    font-weight: 500;
}

[b-8q0m3il0fi] .nav-link.active::before {
    content: "";
    position: absolute;
    left: -8px;
    top: 6px;
    bottom: 6px;
    width: 3px;
    border-radius: 0 2px 2px 0;
    background: var(--color-accent);
}

[b-8q0m3il0fi] .nav-link i {
    width: 18px;
    text-align: center;
    opacity: 0.9;
}

[b-8q0m3il0fi] .nav-item {
    font-size: 1rem;
    padding-bottom: 0;
}

/* FBK-058 — dot dorado al final del item activo. Se controla por CSS:
   opacity 0 por default, 1 cuando .nav-link.active. El dot va DENTRO del
   NavLink (NavItem.razor), por eso requiere ::deep para perforar el scope. */
[b-8q0m3il0fi] .nav-item-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-left: auto;
    flex-shrink: 0;
    background: transparent;
    opacity: 0;
    transition: opacity var(--transition-fast);
}

[b-8q0m3il0fi] .nav-link.active .nav-item-dot {
    opacity: 1;
    background: var(--color-accent);
}

/* ============================================================
   FBK-054 — Bloque usuario al pie del sidebar (paridad MFT)
   ============================================================ */
.sidebar-nav[b-8q0m3il0fi] {
    flex: 1;
}

.sidebar-footer[b-8q0m3il0fi] {
    padding: var(--space-3) var(--space-4);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    margin-top: auto;
}

.sidebar-user-menu[b-8q0m3il0fi] {
    position: relative;
}

.sidebar-user-trigger[b-8q0m3il0fi] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    width: 100%;
    padding: var(--space-2) var(--space-2);
    background: transparent;
    border: 0;
    border-radius: var(--radius-md);
    color: var(--color-text-inverse);
    text-align: left;
    transition: background var(--transition-fast);
    cursor: pointer;
}

.sidebar-user-trigger:hover[b-8q0m3il0fi],
.sidebar-user-trigger[aria-expanded="true"][b-8q0m3il0fi] {
    background: rgba(255, 255, 255, 0.06);
}

.sidebar-user-trigger:focus-visible[b-8q0m3il0fi] {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
}

.sidebar-avatar[b-8q0m3il0fi] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--color-accent);
    color: var(--color-primary-dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.02em;
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.sidebar-user-info[b-8q0m3il0fi] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.sidebar-user-name[b-8q0m3il0fi] {
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--color-text-inverse);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sidebar-user-role[b-8q0m3il0fi] {
    font-size: var(--text-xs);
    color: rgba(255, 255, 255, 0.45);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 2px;
}

.sidebar-user-caret[b-8q0m3il0fi] {
    color: rgba(255, 255, 255, 0.5);
    font-size: var(--text-sm);
    flex-shrink: 0;
}

/* Dropdown contenedor Bootstrap — se renderiza en light surface */
.sidebar-user-dropdown[b-8q0m3il0fi] {
    min-width: 220px;
}

.sidebar-user-dropdown .dropdown-header[b-8q0m3il0fi] {
    padding-top: var(--space-2);
    padding-bottom: var(--space-2);
}

.sidebar-user-dropdown .dropdown-item[b-8q0m3il0fi] {
    display: flex;
    align-items: center;
    font-size: var(--text-sm);
}

.sidebar-user-dropdown .dropdown-item form[b-8q0m3il0fi] {
    display: contents;
}

/* ============================================================
   FBK-059 cambio #3 — Regla MOVIDA desde NavGroup.razor.css.
   ============================================================
   Root cause (validado empíricamente en Fase 1):
   El button .nav-group-toggle-all vive en NavMenu.razor (scope
   b-0g49peg1wb), pero la regla tenia scope NavGroup (b-843njd57m0).
   Selector nunca matcheaba → button caia en user-agent default
   (bgColor=rgb(240,240,240)).
   Fix arquitectónico: regla vive en el CSS isolation file del
   componente dueño del HTML. Sin !important ni workarounds.

   FBK-059 iter 4 — paridad MFT:
   - SIN icono (removido del markup en NavMenu.razor)
   - Alineado a la DERECHA via justify-content: flex-end
   - text-align: right como defensa secundaria por si el span
     recibiera más children en el futuro.
   - Regla .nav-group-toggle-all i dejada como no-op defensivo
     (no hay <i> en DOM ahora, pero si se agregara se estiliza
     consistente). */
.nav-group-toggle-all[b-8q0m3il0fi] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-2);
    width: 100%;
    padding: var(--space-2) var(--space-4);
    margin-bottom: var(--space-2);
    background: transparent;
    border: 0;
    border-radius: var(--radius-md);
    color: rgba(255, 255, 255, 0.45);
    font-size: var(--text-xs);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-align: right;
    cursor: pointer;
    transition: color var(--transition-fast), background var(--transition-fast);
}

.nav-group-toggle-all:hover[b-8q0m3il0fi] {
    color: var(--color-text-inverse);
    background: rgba(255, 255, 255, 0.06);
}

.nav-group-toggle-all:focus-visible[b-8q0m3il0fi] {
    outline: 2px solid var(--color-accent);
    outline-offset: 2px;
}

.nav-group-toggle-all i[b-8q0m3il0fi] {
    font-size: var(--text-sm);
    opacity: 0.8;
}
/* _content/WizeAdmin/Components/Pages/Exceptions/Details.razor.rz.scp.css */
.header-section[b-uq463nrrcw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
}

.exc-title[b-uq463nrrcw] {
    color: var(--color-primary);
    font-weight: 700;
}

.badge-status[b-uq463nrrcw] {
    border-radius: var(--radius-lg);
    padding: 6px 16px;
    font-weight: 600;
    color: var(--color-text-inverse);
}

.bg-active[b-uq463nrrcw] {
    background-color: var(--color-warning);
}

.bg-high[b-uq463nrrcw] {
    background-color: var(--color-danger);
}

.bg-payment[b-uq463nrrcw] {
    background-color: var(--color-accent);
}

.custom-tabs .nav-link[b-uq463nrrcw] {
    color: var(--color-text-secondary);
    border: none;
    font-weight: 600;
    padding: 10px 20px;
}

.custom-tabs .nav-link.active[b-uq463nrrcw] {
    color: var(--accent-gold);
    border-bottom: 3px solid var(--accent-gold);
    background: transparent;
}

.card-panel[b-uq463nrrcw] {
    background: var(--color-surface);
    border-radius: var(--radius-xl);
    border: 1px solid var(--color-border);
    padding: 20px;
    margin-bottom: 20px;
}

.btn-action[b-uq463nrrcw] {
    width: 100%;
    margin-bottom: 10px;
    font-weight: 600;
    border-radius: 8px;
}

.timeline-item[b-uq463nrrcw] {
    padding-left: 20px;
    border-left: 2px solid var(--color-border);
    position: relative;
    margin-bottom: 20px;
}

.timeline-item[b-uq463nrrcw]::before {
    content: '';
    position: absolute;
    left: -7px;
    top: 0;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--color-primary);
}

.json-panel[b-uq463nrrcw] {
    background-color: var(--color-background);
    border-radius: var(--radius-lg);
    padding: 15px;
}

.json-box[b-uq463nrrcw] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    padding: 12px;
    border-radius: var(--radius-lg);
    font-size: 0.85rem;
    min-height: 150px;
}
/* _content/WizeAdmin/Components/Pages/Exceptions/Index.razor.rz.scp.css */
.filter-section[b-c4ndx9j3oe] {
    background: var(--color-surface);
    padding: var(--space-5);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
}

.table-container[b-c4ndx9j3oe] {
    background: var(--color-surface);
    padding: var(--space-5);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    /* F-UX-003 — con 10 columnas la tabla puede exceder el ancho disponible.
       Scroll horizontal en vez de aplastar Descripción (aplica a vista plana y agrupada). */
    overflow-x: auto;
}

.table thead[b-c4ndx9j3oe] {
    background-color: var(--color-background);
    color: var(--color-text-secondary);
}

.badge-priority[b-c4ndx9j3oe] {
    width: 80px;
    display: inline-block;
    font-weight: bold;
    border-radius: 15px;
    text-align: center;
    padding: 3px 8px;
}

.priority-high[b-c4ndx9j3oe] {
    background-color: var(--color-danger-subtle);
    color: var(--color-danger);
}

.priority-medium[b-c4ndx9j3oe] {
    background-color: var(--color-warning-subtle);
    color: var(--color-warning);
}

.priority-low[b-c4ndx9j3oe] {
    background-color: var(--color-success-subtle);
    color: var(--color-success);
}

.status-pill[b-c4ndx9j3oe] {
    border-radius: 15px;
    padding: 2px 12px;
    font-size: 0.85rem;
    text-transform: uppercase;
}

.status-pending[b-c4ndx9j3oe] {
    background-color: var(--color-warning-subtle);
    color: var(--color-warning);
}

.status-progress[b-c4ndx9j3oe] {
    background-color: var(--color-info-subtle);
    color: var(--color-info);
}

.status-resolved[b-c4ndx9j3oe] {
    background-color: var(--color-success-subtle);
    color: var(--color-success);
}

.btn-view[b-c4ndx9j3oe] {
    background-color: var(--color-primary);
    color: var(--color-text-inverse);
    font-size: 0.8rem;
    border-radius: var(--radius-md);
}

.pagination .page-link[b-c4ndx9j3oe] {
    color: var(--color-primary);
}

.pagination .active .page-link[b-c4ndx9j3oe] {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

/* Pruebas table — column width control */
/* FBK CEO — objetivo: que TODO quepa sin scroll horizontal aun con el sidebar EXPANDIDO.
   Medición empírica (:6055, sidebar expandido, .table-container con padding ~40px):
     viewport 1440 → ancho interno útil ~1090px
     viewport 1280 → ancho interno útil ~930px
   Se replegó la columna "Proceso" (−130px) y se comprimieron los anchos. Σ columnas fijas
   = 40+96+58+58+58+165+122+96 = 693px; con piso de Descripción (~235px) el min-width queda en
   928px → cabe en el ancho útil ~970px (medido a 1280 + sidebar expandido). 58px es el TECHO de
   las 3 columnas numéricas: probado empíricamente, 64px empuja el table-container a scroll a 1280
   (tcScrollW 986 > 970). Impacto/Acción anchos para no cortar montos de 8 cifras
   ("RD$11,176,696.64") ni el botón "Ver detalle"; Severidad a 122px para que el dropdown muestre
   "Media" completo. Con table-layout:fixed, col-desc absorbe el remanente. overflow-x:auto queda
   solo como red de seguridad <928px. */
.pruebas-table[b-c4ndx9j3oe] { table-layout: fixed; width: 100%; min-width: 928px; }
/* Header comprimido: evita que "Excepciones/Asignadas/Resueltas" (columnas angostas) se toquen. */
.pruebas-table thead th[b-c4ndx9j3oe] { font-size: 0.82rem; }
.pruebas-table .col-id[b-c4ndx9j3oe]     { width: 40px; }
.pruebas-table .col-fecha[b-c4ndx9j3oe]  { width: 96px; white-space: nowrap; }
/* Fills remaining space; el min-width de la tabla le garantiza un piso efectivo de ~235px. */
.pruebas-table .col-desc[b-c4ndx9j3oe]   { min-width: 235px; }
/* FBK CEO — anchos por-palabra: cada columna se dimensiona al ancho de SU header nowrap
   ("Excepciones" es la más larga → 74px; "Asignadas"/"Resueltas" son más cortas → 62/60px).
   La palabra entra completa en 1 línea a 0.72rem sin partirse ni solaparse. */
.pruebas-table .col-num[b-c4ndx9j3oe]     { width: 74px; }
/* FBK CEO — columnas Asignadas / Resueltas (paridad con producción) */
.pruebas-table .col-asig[b-c4ndx9j3oe]    { width: 62px; }
.pruebas-table .col-res[b-c4ndx9j3oe]     { width: 60px; }
/* FBK CEO — los 3 headers numéricos ("Excepciones"/"Asignadas"/"Resueltas") deben verse como
   palabra COMPLETA en UNA SOLA LÍNEA, centrada, sin partirse ni solaparse. nowrap garantiza que la
   palabra nunca se rompe; se baja la fuente del header a 0.72rem y se comprime el padding horizontal
   para que la palabra entera quepa en el ancho de su columna sin desbordar hacia la vecina.
   Los NÚMEROS de las filas conservan su tamaño (count-chip 0.85rem) — solo se achica el header. */
.pruebas-table thead th.col-num[b-c4ndx9j3oe],
.pruebas-table thead th.col-asig[b-c4ndx9j3oe],
.pruebas-table thead th.col-res[b-c4ndx9j3oe] {
    white-space: nowrap;
    text-align: center;
    vertical-align: bottom;
    font-size: 0.72rem;
    padding-left: 0.15rem;
    padding-right: 0.15rem;
}
/* Impacto: no cortar montos reales de 8 cifras "RD$11,176,696.64" (nowrap en .impact-chip). */
.pruebas-table .col-impacto[b-c4ndx9j3oe] { width: 165px; }
.pruebas-table .col-sev[b-c4ndx9j3oe]     { width: 122px; }
.pruebas-table .col-action[b-c4ndx9j3oe]  { width: 96px; }

/* REQ-WCC-090 — badge de severidad (mismo lenguaje visual que /processes TestRow).
   Variables canónicas en wwwroot/app.css :root (--wize-severity-*). */
.severity-badge[b-c4ndx9j3oe] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}
.severity-badge.severity-alta[b-c4ndx9j3oe]  { background-color: var(--wize-severity-alta);  }
.severity-badge.severity-media[b-c4ndx9j3oe] { background-color: var(--wize-severity-media); }
.severity-badge.severity-baja[b-c4ndx9j3oe]  { background-color: var(--wize-severity-baja);  }

.col-desc-cell[b-c4ndx9j3oe] {
    word-break: break-word;
    white-space: normal;
}
.col-desc-cell small[b-c4ndx9j3oe] {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Recuadros de color para Excepciones/Impacto — más presencia visual en el listado */
.count-chip[b-c4ndx9j3oe], .impact-chip[b-c4ndx9j3oe] {
    display: inline-block;
    padding: 0.25rem 0.65rem;
    border-radius: var(--radius-md, 6px);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    font-size: 0.85rem;
}
.count-chip-active[b-c4ndx9j3oe] {
    background-color: var(--color-primary-subtle);
    color: var(--color-primary);
}
/* FBK CEO — chips Asignados (info) / Resueltos (success), tonos suaves como Excepciones */
.assigned-chip[b-c4ndx9j3oe] {
    background-color: var(--color-info-subtle);
    color: #1D4ED8; /* WCAG AA ≥4.5:1 sobre info-subtle (F-UX-002) */
}
.resolved-chip[b-c4ndx9j3oe] {
    background-color: var(--color-success-subtle);
    color: #047857; /* WCAG AA ≥4.5:1 sobre success-subtle (F-UX-001) */
}
.count-chip-empty[b-c4ndx9j3oe] {
    background-color: var(--color-background);
    color: var(--color-text-secondary);
}
.impact-chip[b-c4ndx9j3oe] {
    background-color: var(--color-warning-subtle);
    color: #92620A;
    white-space: nowrap;
}

/* REQ-WCC-066 CA-3 — agrupación por proceso */
.group-toggle .form-check-label[b-c4ndx9j3oe] {
    font-size: 0.85rem;
    color: var(--color-text-secondary);
    cursor: pointer;
}
.group-toggle .form-check-input:checked[b-c4ndx9j3oe] {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.group-header-row > td[b-c4ndx9j3oe] {
    background-color: var(--color-background);
    border-top: 2px solid var(--color-primary);
    color: var(--color-primary);
    font-size: 0.9rem;
    padding-top: var(--space-2);
    padding-bottom: var(--space-2);
}
.group-subtotal-tasa[b-c4ndx9j3oe] {
    font-size: 0.8rem;
    font-weight: 400;
    color: var(--color-text-secondary);
}

/* FBK CEO — encabezado visible de página (mismo lenguaje que /processes) */
.exceptions-header[b-c4ndx9j3oe] {
    margin-bottom: var(--space-4);
}
.exceptions-header .main-title[b-c4ndx9j3oe] {
    font-family: var(--font-display);
    color: var(--brand-navy-700);
    font-weight: 800;
    margin-bottom: 0.25rem;
}

/* FBK CEO — chevron colapsar/expandir del grupo */
.group-toggle-chevron[b-c4ndx9j3oe] {
    cursor: pointer;
    color: var(--color-primary);
    margin-right: 0.35rem;
    display: inline-flex;
    align-items: center;
}
.group-toggle-chevron:focus-visible[b-c4ndx9j3oe] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
    border-radius: 3px;
}

/* FBK CEO — icono info + tooltip legible: explica qué significa la Tasa */
.tasa-info[b-c4ndx9j3oe] {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-left: 0.25rem;
    color: var(--color-text-secondary);
    cursor: help;
}
.tasa-info-tooltip[b-c4ndx9j3oe] {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    max-width: 80vw;
    background: var(--brand-navy-700);
    color: #fff;
    padding: 0.6rem 0.75rem;
    border-radius: var(--radius-md, 6px);
    font-size: 0.8rem;
    font-weight: 400;
    line-height: 1.35;
    text-transform: none;
    letter-spacing: normal;
    white-space: normal;
    z-index: 30;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.12s ease;
}
.tasa-info-tooltip[b-c4ndx9j3oe]::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: var(--brand-navy-700);
}
.tasa-info:hover .tasa-info-tooltip[b-c4ndx9j3oe],
.tasa-info:focus .tasa-info-tooltip[b-c4ndx9j3oe],
.tasa-info:focus-within .tasa-info-tooltip[b-c4ndx9j3oe] {
    opacity: 1;
    visibility: visible;
}
/* _content/WizeAdmin/Components/Pages/Exceptions/Kanban.razor.rz.scp.css */
.filter-row[b-hmllypsgz7] {
    background: var(--color-surface);
    padding: 15px;
    border-radius: var(--radius-lg);
    margin-bottom: 20px;
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-xs);
}

.kanban-container[b-hmllypsgz7] {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding-bottom: 10px;
}

.kanban-column[b-hmllypsgz7] {
    min-width: 220px;
    background-color: var(--color-background-hover);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    flex: 1;
}

.kanban-header[b-hmllypsgz7] {
    background-color: var(--color-primary-dark);
    color: var(--color-text-inverse);
    padding: 8px 12px;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    display: flex;
    justify-content: space-between;
    font-weight: 600;
    font-size: 0.9rem;
}

.kanban-column-body[b-hmllypsgz7] {
    min-height: 80px;
    padding: 4px 0;
}

.kanban-card[b-hmllypsgz7] {
    background: var(--color-surface);
    margin: 8px;
    padding: 10px;
    border-radius: var(--radius-lg);
    border-left: 5px solid var(--color-border-strong);
    border-top: 1px solid var(--color-border);
    border-right: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
    box-shadow: var(--shadow-xs);
}

/* REQ-WCC-061 / CA-5 — Fix: card-critical faltaba en el CSS (styling bug confirmado) */
.card-critical[b-hmllypsgz7] {
    border-left-color: #8B0000; /* rojo oscuro — crítica */
}

.card-high[b-hmllypsgz7] {
    border-left-color: var(--color-danger);
}

.card-medium[b-hmllypsgz7] {
    border-left-color: var(--color-warning);
}

.card-low[b-hmllypsgz7] {
    border-left-color: var(--color-success);
}

.card-id[b-hmllypsgz7] {
    font-size: 0.8rem;
    color: var(--color-text-secondary);
}

.card-title[b-hmllypsgz7] {
    font-weight: bold;
    font-size: 0.95rem;
    margin-top: 5px;
}

.card-meta[b-hmllypsgz7] {
    font-size: 0.85rem;
    color: var(--color-text-secondary);
    margin: 8px 0;
}

.priority-text[b-hmllypsgz7] {
    color: var(--color-danger);
    font-weight: bold;
}

/* REQ-WCC-061 / CA-3 / RISK-061-3 — Aging visual en cards del Kanban.
   El AgingStatus es calculado server-side — estas clases solo aplican el estilo.
   Se usa border-top para no colisionar con el border-left de prioridad (card-critical/high/etc.). */
.aging-vencida[b-hmllypsgz7] {
    border-top: 3px solid #D93025; /* rojo — DueDate vencida */
    box-shadow: 0 0 0 1px #D9302533, var(--shadow-xs);
}

.aging-en-riesgo[b-hmllypsgz7] {
    border-top: 3px solid #F09C1A; /* ámbar — vence en <= 1 día */
}

.aging-ok[b-hmllypsgz7] {
    border-top: 3px solid #2E7D32; /* verde — >= 2 días de margen */
}

/* REQ-WCC-061 / CTL-061-02 — Columna restringida (defensa UX en profundidad).
   El control real es server-side. Esta clase reduce el affordance visual de drop. */
.kanban-col-restricted[b-hmllypsgz7] {
    opacity: 0.85;
    cursor: not-allowed;
}
/* _content/WizeAdmin/Components/Pages/Exceptions/TeamAssignments.razor.rz.scp.css */
/* REQ-WCC-100 — rediseño visual de "Asignaciones del equipo" (feedback CEO 2026-07-09).
   Reusa los design tokens del theme (wwwroot/css/theme.css) para quedar consistente con el resto
   del WCC (Dashboard, KpiCardView) sin duplicar la paleta. */

.team-header[b-7eclnbe11j] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-3, 1rem);
    flex-wrap: wrap;
}

.team-kpi-card[b-7eclnbe11j] {
    display: flex;
    align-items: center;
    gap: var(--space-3, 0.75rem);
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: var(--radius-xl, 0.75rem);
    box-shadow: var(--shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.05));
    padding: var(--space-4, 1rem);
    border-left: 4px solid var(--color-border, #e2e8f0);
    min-height: 88px;
}

.team-kpi-navy[b-7eclnbe11j] { border-left-color: #0B3B54; }
.team-kpi-gold[b-7eclnbe11j] { border-left-color: #BD954E; }
.team-kpi-danger[b-7eclnbe11j] { border-left-color: var(--color-danger, #991B1B); }
.team-kpi-warning[b-7eclnbe11j] { border-left-color: var(--color-warning, #d97706); }

.team-kpi-icon[b-7eclnbe11j] {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-primary-subtle, #eef2f6);
    color: #0B3B54;
    font-size: 1.1rem;
}

.team-kpi-navy .team-kpi-icon[b-7eclnbe11j] { background: rgba(11, 59, 84, 0.1); color: #0B3B54; }
.team-kpi-gold .team-kpi-icon[b-7eclnbe11j] { background: rgba(189, 149, 78, 0.15); color: #8a6a34; }
.team-kpi-danger .team-kpi-icon[b-7eclnbe11j] { background: rgba(153, 27, 27, 0.1); color: #991B1B; }
.team-kpi-warning .team-kpi-icon[b-7eclnbe11j] { background: rgba(217, 119, 6, 0.12); color: #92400e; }

.team-kpi-body[b-7eclnbe11j] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.team-kpi-value[b-7eclnbe11j] {
    font-size: var(--text-2xl, 1.5rem);
    font-weight: 700;
    color: var(--color-text, #1e293b);
    line-height: 1.2;
}

.team-kpi-label[b-7eclnbe11j] {
    /* FIX cosmético v2 (CEO 2026-07-09) — etiquetas CORTAS ("Excepciones",
       "Urgentes", "En riesgo", "Analistas", "Monto en riesgo") en UNA sola
       línea. Nada de partir palabras a la mitad (se veía poco profesional).
       Si excepcionalmente no entra, elipsis limpia al final de palabra. */
    font-size: var(--text-xs, 0.75rem);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--color-text-secondary, #64748b);
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: keep-all;
    line-height: 1.3;
}

/* Alineación consistente de columnas entre TODOS los procesos (feedback CEO 2026-07-09).
   table-layout:fixed hace que los anchos del <colgroup> manden por encima del contenido,
   así "Compras y Cuentas por Pagar" y "Facturación y Cuentas por Cobrar" quedan idénticas. */
.team-assign-table[b-7eclnbe11j] {
    table-layout: fixed;
    width: 100%;
}

.team-assign-table td[b-7eclnbe11j],
.team-assign-table th[b-7eclnbe11j] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-analyst-chip[b-7eclnbe11j] {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    font-size: 0.8125rem;
    color: var(--color-text, #1e293b);
}

.team-empty-state[b-7eclnbe11j] {
    text-align: center;
    padding: var(--space-6, 3.5rem) var(--space-4, 1rem);
    color: var(--color-text-secondary, #64748b);
    background: var(--color-surface, #fff);
    border: 1px dashed var(--color-border, #e2e8f0);
    border-radius: var(--radius-xl, 0.75rem);
}

.team-empty-state i[b-7eclnbe11j] {
    font-size: 2.75rem;
    color: var(--color-success, #059669);
    display: block;
    margin-bottom: var(--space-3, 0.75rem);
}

.team-empty-state h5[b-7eclnbe11j] {
    color: var(--color-text, #1e293b);
    margin-bottom: var(--space-1, 0.25rem);
}

.team-empty-state p[b-7eclnbe11j] {
    margin-bottom: 0;
}
/* _content/WizeAdmin/Components/Pages/Processes/Index.razor.rz.scp.css */
/* REQ-047 — Pantalla Pruebas */

.processes-page[b-nq340fp0wk] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.processes-header[b-nq340fp0wk] { margin-bottom: 0.25rem; }
.processes-header .main-title[b-nq340fp0wk] {
    font-family: var(--font-display);
    color: var(--brand-navy-700);
    font-weight: 800;
    margin-bottom: 0.25rem;
}

/* CA-3 — toolbar responsive sin overflow */
.processes-toolbar[b-nq340fp0wk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.75rem;
    background-color: #fff;
    border: 1px solid var(--brand-navy-100);
    border-radius: 0.5rem;
}
.processes-toolbar-search[b-nq340fp0wk] {
    position: relative;
    flex: 1 1 240px;
    min-width: 220px;
    max-width: 420px;
}
.processes-toolbar-search i[b-nq340fp0wk] {
    position: absolute;
    top: 50%; left: 0.6rem;
    transform: translateY(-50%);
    color: var(--brand-navy-400);
    pointer-events: none;
}
.processes-toolbar-search input[b-nq340fp0wk] { padding-left: 1.85rem; }

.processes-toolbar-actions[b-nq340fp0wk] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-left: auto;
}

.processes-grid[b-nq340fp0wk] {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.processes-grid-flat[b-nq340fp0wk] {
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--brand-navy-100);
    border-radius: 8px;
    /* REQ-WCC-CEO-027 — scroll horizontal accesible en la vista plana (sin agrupar). */
    overflow-x: auto;
}

/* Header de tabla dentro del card body.
   REQ-WCC-093 — el grid de .test-row vive en TestRow.razor.css (scoped al componente
   TestRow) y NO alcanza a este header (está en Index.razor, otro scope). Por eso hay
   que replicar EXACTAMENTE las mismas columnas acá para que los rótulos queden alineados
   sobre su columna de datos. Mantener en sync con TestRow.razor.css. */
.test-row.test-row-header[b-nq340fp0wk] {
    display: grid;
    grid-template-columns:
        70px                    /* code */
        minmax(180px, 2fr)      /* name */
        48px                    /* toggle */
        minmax(140px, 1fr)      /* field */
        96px;                   /* action — Detalles de la prueba */
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 1rem;
    background-color: var(--brand-navy-50);
    color: var(--brand-navy-700);
    font-weight: 600;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    line-height: 1.15;
    min-height: 38px;
    border-bottom: 1px solid var(--brand-navy-100);
}

.test-row.test-row-header .test-row-toggle[b-nq340fp0wk],
.test-row.test-row-header .test-row-action[b-nq340fp0wk] {
    text-align: center;
}

@media (max-width: 768px) {
    .test-row.test-row-header[b-nq340fp0wk] { display: none; }
}

/* Toast de confirmación de guardado (top-right, auto-dismiss). Brand: navy + acento oro. */
.wize-toast[b-nq340fp0wk] {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 1080;
    display: flex;
    align-items: center;
    padding: 0.625rem 1rem;
    background-color: var(--brand-navy-600, #0B3B54);
    color: #fff;
    font-weight: 500;
    border-radius: 0.5rem;
    border-left: 3px solid var(--brand-gold-500, #BD954E);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
    animation: wize-toast-in-b-nq340fp0wk 0.2s ease-out;
}

.wize-toast .bi-check-circle-fill[b-nq340fp0wk] {
    color: var(--brand-gold-500, #BD954E);
}

@keyframes wize-toast-in-b-nq340fp0wk {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
}
/* _content/WizeAdmin/Components/Pages/Processes/ProcessCard.razor.rz.scp.css */
/* REQ-047 §1 — Tarjeta proceso colapsable */

.process-card-v2[b-u35u14u4a1] {
    background-color: #fff;
    border: 1px solid var(--brand-navy-100);
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(11, 59, 84, 0.08);
}

.process-card-header[b-u35u14u4a1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.85rem 1rem;
    background-color: var(--brand-navy-600);
    color: #fff;
    border: none;
    cursor: pointer;
    text-align: left;
    min-height: 48px;
    transition: background-color 0.2s ease;
}

.process-card-header:hover[b-u35u14u4a1] { background-color: var(--brand-navy-700); }
.process-card-header:focus-visible[b-u35u14u4a1] {
    outline: 2px solid var(--brand-gold-300);
    outline-offset: -2px;
}

.process-card-title[b-u35u14u4a1] {
    flex-grow: 1;
    font-family: var(--font-display);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 1rem;
}

.process-card-pill[b-u35u14u4a1] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    background-color: var(--brand-gold-500);
    color: var(--brand-navy-700);
    font-weight: 700;
    font-size: 0.82rem;
    font-variant-numeric: tabular-nums;
}

.process-card-chevron[b-u35u14u4a1] { font-size: 1rem; }

.process-card-body[b-u35u14u4a1] {
    background-color: #fff;
    /* REQ-WCC-CEO-027 — scroll horizontal accesible: cuando el grid de pruebas (~1160px de
       columnas mínimas) excede el ancho de la tarjeta, aparece scrollbar en vez de truncar la
       columna de impacto. La tarjeta padre mantiene overflow:hidden para las esquinas redondeadas. */
    overflow-x: auto;
}

@media (prefers-reduced-motion: reduce) {
    .process-card-header[b-u35u14u4a1] { transition: none; }
}
/* _content/WizeAdmin/Components/Pages/Processes/TestRow.razor.rz.scp.css */
/* REQ-047 §2 — Fila prueba (52px desktop, stacked móvil) */

.test-row[b-dl9jm4gqfh] {
    display: grid;
    grid-template-columns:
        70px                    /* code */
        minmax(180px, 2fr)      /* name */
        48px                    /* toggle */
        minmax(140px, 1fr)      /* field dropdown — REQ-WCC-090: pantalla magra, resto se movió a /exceptions */
        96px;                   /* acción "Detalles de la prueba" (editar Objetivo/Justificación) — REQ-WCC-093 CA-2 */
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 1rem;
    min-height: 52px;
    border-bottom: 1px solid var(--brand-navy-50);
    transition: background-color 0.2s ease, opacity 0.3s ease;
}

.test-row:hover[b-dl9jm4gqfh] { background-color: var(--brand-navy-50); }

.test-row-off[b-dl9jm4gqfh] { opacity: 0.55; }

.test-row-code[b-dl9jm4gqfh] {
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: var(--brand-navy-700);
}

.test-row-name[b-dl9jm4gqfh] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--brand-navy-700);
}

.test-row-impact strong[b-dl9jm4gqfh] { color: var(--brand-navy-600); }

/* Severity badge pills — CA-2 REQ-WCC-066
   Variables canónicas en wwwroot/app.css :root (REQ-WCC-071 — canonizado desde scoped CSS) */
.severity-badge[b-dl9jm4gqfh] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}
.severity-badge.severity-alta[b-dl9jm4gqfh]  { background-color: var(--wize-severity-alta);  }
.severity-badge.severity-media[b-dl9jm4gqfh] { background-color: var(--wize-severity-media); }
.severity-badge.severity-baja[b-dl9jm4gqfh]  { background-color: var(--wize-severity-baja);  }

.test-row-rate[b-dl9jm4gqfh] {
    font-variant-numeric: tabular-nums;
    font-size: 0.875rem;
}
.test-row-rate strong[b-dl9jm4gqfh] { color: var(--brand-navy-600); }

/* REQ-WCC-093 CA-2 — botón editar Objetivo/Justificación */
.test-row-action[b-dl9jm4gqfh] {
    display: flex;
    justify-content: center;
}
.test-row-action .btn[b-dl9jm4gqfh] {
    color: var(--brand-navy-400);
    padding: 0.15rem 0.35rem;
    line-height: 1;
}
.test-row-action .btn:hover[b-dl9jm4gqfh] { color: var(--brand-navy-700); }

.test-row-process-label[b-dl9jm4gqfh] {
    grid-column: 1 / -1;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--brand-navy-400);
    padding: 0.25rem 1rem 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

@media (max-width: 768px) {
    .test-row[b-dl9jm4gqfh] {
        grid-template-columns: 1fr;
        gap: 0.4rem;
        padding: 0.85rem 1rem;
    }
    .test-row-name[b-dl9jm4gqfh] { white-space: normal; }
    .test-row-impact[b-dl9jm4gqfh] { text-align: left !important; }
}

@media (prefers-reduced-motion: reduce) {
    .test-row[b-dl9jm4gqfh] { transition: none; }
}
/* _content/WizeAdmin/Components/Pages/Reports/ExceptionDetail.razor.rz.scp.css */
.card-header[b-7qlqnc7wl8] {
    background: var(--color-primary) !important;
    color: var(--color-text-inverse) !important;
    border-bottom: 1px solid var(--color-border);
}

.table thead th[b-7qlqnc7wl8] {
    background: var(--color-background);
    color: var(--color-text-secondary);
    border-bottom: 1px solid var(--color-border);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: var(--text-xs);
    padding: var(--space-2) var(--space-3);
    font-weight: 600;
}

.table td[b-7qlqnc7wl8] {
    color: var(--color-text);
    border-color: var(--color-border);
    font-size: var(--text-sm);
    padding: var(--space-2) var(--space-3);
}

.table-hover tbody tr:hover[b-7qlqnc7wl8] {
    background: var(--color-background-hover);
}

.sortable-header[b-7qlqnc7wl8] {
    cursor: pointer;
    user-select: none;
}

.sortable-header:hover[b-7qlqnc7wl8] {
    background: var(--color-background-hover) !important;
}

.sort-icon-inactive[b-7qlqnc7wl8] {
    opacity: 0.3;
    font-size: 0.7em;
    margin-left: 2px;
}

.sort-icon-active[b-7qlqnc7wl8] {
    color: var(--color-primary);
    font-size: 0.8em;
    margin-left: 2px;
}

.page-link[b-7qlqnc7wl8] {
    color: var(--color-primary);
    font-size: var(--text-sm);
}

.page-item.active .page-link[b-7qlqnc7wl8] {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.form-label[b-7qlqnc7wl8] {
    font-size: var(--text-xs);
    font-weight: 600;
    color: var(--color-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
/* _content/WizeAdmin/Components/Pages/Reports/Index.razor.rz.scp.css */
.section-title[b-nsnwvszuqe] {
    font-weight: 700;
    margin: 25px 0 15px 0;
    font-size: var(--text-lg);
    color: var(--color-text);
    display: flex;
    align-items: center;
}

.section-title i[b-nsnwvszuqe] {
    color: var(--color-primary);
}

.report-card[b-nsnwvszuqe] {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    height: 100%;
    transition: box-shadow 0.2s, border-color 0.2s;
}

.report-card:hover[b-nsnwvszuqe] {
    box-shadow: var(--shadow-md);
    border-color: var(--color-border-strong);
}

.report-card .card-body[b-nsnwvszuqe] {
    display: flex;
    gap: 15px;
}

.report-icon-box[b-nsnwvszuqe] {
    width: 50px;
    min-width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-inverse);
    font-size: 1.5rem;
    border-radius: var(--radius-md);
}

.btn-generate[b-nsnwvszuqe] {
    background: var(--color-primary-subtle);
    border: none;
    font-size: var(--text-xs);
    padding: 4px 14px;
    border-radius: var(--radius-sm);
    color: var(--color-primary);
    font-weight: 600;
    cursor: pointer;
}

.btn-generate:hover[b-nsnwvszuqe] {
    background: var(--color-primary);
    color: var(--color-text-inverse);
}

.form-label[b-nsnwvszuqe] {
    font-weight: 600;
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
}

.btn-create[b-nsnwvszuqe] {
    background-color: var(--color-primary);
    color: var(--color-text-inverse);
    padding: 8px 24px;
    border: none;
    border-radius: var(--radius-md);
    font-weight: 600;
}

.btn-create:hover[b-nsnwvszuqe] {
    background-color: var(--color-primary-light);
    color: var(--color-text-inverse);
}

.btn-create:disabled[b-nsnwvszuqe] {
    opacity: 0.5;
    cursor: not-allowed;
}

.bg-teal[b-nsnwvszuqe] {
    background-color: var(--color-primary);
}

.bg-gold[b-nsnwvszuqe] {
    background-color: var(--color-accent);
}
/* _content/WizeAdmin/Components/Pages/ResultPages/Details.razor.rz.scp.css */
.container-fluid[b-49a9cgskm9] {
    /* FBK CEO — mínimo hueco arriba (entre topbar y encabezado): la tabla arranca más arriba. */
    padding-top: 0;
    font-size: var(--text-base);
}

/* FBK CEO — el encabezado slim va pegado arriba, sin margen superior muerto. */
#content .details-header[b-49a9cgskm9] {
    margin-top: var(--space-1);
}

#content .card[b-49a9cgskm9] {
    background: var(--color-surface);
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs) !important;
}

#content .d-flex.justify-content-end.mb-2[b-49a9cgskm9] {
    margin-bottom: var(--space-4) !important;
}

#content .d-flex.gap-2.mb-3[b-49a9cgskm9] {
    margin-bottom: var(--space-4) !important;
    gap: var(--space-2) !important;
}

#content .card-header[b-49a9cgskm9] {
    background: var(--color-background) !important;
    border-bottom: 1px solid var(--color-border);
}

#content .btn[b-49a9cgskm9] {
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: 500;
}

#content .btn-outline-secondary[b-49a9cgskm9],
#content .btn-outline-primary[b-49a9cgskm9],
#content .btn-outline-success[b-49a9cgskm9] {
    border-color: var(--color-border-strong);
    color: var(--color-text);
}

#content .btn-outline-secondary:hover[b-49a9cgskm9],
#content .btn-outline-primary:hover[b-49a9cgskm9],
#content .btn-outline-success:hover[b-49a9cgskm9] {
    background: var(--color-background);
    border-color: var(--color-primary-light);
    color: var(--color-primary);
}

#content .btn-primary[b-49a9cgskm9] {
    background: var(--color-primary);
    border-color: var(--color-primary);
}

#content .btn-primary:hover[b-49a9cgskm9] {
    background: var(--color-primary-light);
    border-color: var(--color-primary-light);
}

#content .btn.btn-sm[b-49a9cgskm9] {
    padding: 0.3rem 0.65rem;
}

#content h1[b-49a9cgskm9],
#content h2[b-49a9cgskm9],
#content h3[b-49a9cgskm9],
#content h4[b-49a9cgskm9],
#content h5[b-49a9cgskm9],
#content h6[b-49a9cgskm9] {
    letter-spacing: -0.01em;
}

#content blockquote p[b-49a9cgskm9] {
    margin-bottom: 0;
    color: var(--color-text);
}

/* FBK CEO — encabezado slim de una fila (reemplaza el card grande del header). */
#content .details-header[b-49a9cgskm9] {
    padding: var(--space-1) var(--space-1) var(--space-1) 0;
}

#content .details-header__title[b-49a9cgskm9] {
    font-size: var(--text-md);
    font-weight: 600;
    color: var(--color-text);
    letter-spacing: -0.01em;
}

#content .details-header__proc[b-49a9cgskm9] {
    font-weight: 500;
    font-size: var(--text-sm);
}

/* FBK CEO: botón Exportar en navy de marca en TODOS los estados (nada de verde de Bootstrap). */
#content .export-btn[b-49a9cgskm9],
#content .export-btn:hover[b-49a9cgskm9],
#content .export-btn:focus[b-49a9cgskm9],
#content .export-btn:active[b-49a9cgskm9],
#content .export-btn.show[b-49a9cgskm9],
#content .btn-group.show > .export-btn.dropdown-toggle[b-49a9cgskm9] {
    background: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: #fff !important;
    box-shadow: none !important;
}

#content .blockquote-footer[b-49a9cgskm9] {
    color: var(--color-text-secondary);
    margin-bottom: 0;
    margin-top: var(--space-1);
    font-size: var(--text-sm);
}

#content .text-muted[b-49a9cgskm9] {
    color: var(--color-text-secondary) !important;
}

.progress[b-49a9cgskm9] {
    border-radius: 2px;
    overflow: hidden;
}

.progress-bar[b-49a9cgskm9] {
    transition: width 0.6s ease;
}

.card[b-49a9cgskm9] {
    transition: all 0.2s ease;
}

.bg-light[b-49a9cgskm9] {
    background-color: var(--color-background) !important;
    border: 1px solid var(--color-border);
}

    .bg-light:hover[b-49a9cgskm9] {
        background-color: var(--color-background-hover) !important;
        transition: background-color 0.2s ease;
    }

.table th[b-49a9cgskm9] {
    font-weight: 600;
    font-size: 0.875rem;
    color: var(--color-text-secondary);
}

.table td[b-49a9cgskm9] {
    font-size: 0.875rem;
    vertical-align: middle;
}

.table-responsive[b-49a9cgskm9] {
    border-radius: 0 0 0.375rem 0.375rem;
}

@media (max-width: 576px) {
    .col-6[b-49a9cgskm9] {
        margin-bottom: 0.5rem;
    }

    .btn-sm[b-49a9cgskm9] {
        font-size: 0.8rem;
        padding: 0.375rem 0.75rem;
    }

    .table[b-49a9cgskm9] {
        font-size: 0.8rem;
    }
}
/* _content/WizeAdmin/Components/Pages/ResultPages/ExceptionFieldTable.razor.rz.scp.css */
.card[b-r03ahqhpsk] {
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs) !important;
    overflow: hidden;
}

/* REQ-WCC-069 (FBK CEO drill-down) — embebido dentro de la vista agrupada: sin borde/sombra/radio,
   se integra como sub-tabla de detalle debajo de la fila del grupo. */
.card.eft-embedded[b-r03ahqhpsk] {
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0;
}

.card.eft-embedded .table thead th[b-r03ahqhpsk] {
    background: var(--color-background);
    font-size: var(--text-xs);
}

.card-header[b-r03ahqhpsk] {
    background: var(--color-surface) !important;
    color: var(--color-text) !important;
    border-bottom: 1px solid var(--color-border);
    padding: var(--space-4) var(--space-5);
}

.card-header .badge[b-r03ahqhpsk] {
    background: var(--color-primary-subtle) !important;
    color: var(--color-primary) !important;
    border-radius: 999px;
    font-size: var(--text-xs);
    font-weight: 600;
}

.table[b-r03ahqhpsk] {
    --bs-table-striped-bg: transparent;
    margin-bottom: 0;
}

.table thead th[b-r03ahqhpsk] {
    background: var(--color-background);
    color: var(--color-text-secondary);
    border-bottom: 1px solid var(--color-border);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: var(--text-xs);
    padding-top: var(--space-3);
    padding-bottom: var(--space-3);
    font-weight: 600;
    position: sticky; /* header fijo al scrollear muchos registros */
    top: 0;
    z-index: 2;
}

.table td[b-r03ahqhpsk] {
    color: var(--color-text);
    border-color: var(--color-border);
    font-size: var(--text-sm);
    padding-top: var(--space-3);
    padding-bottom: var(--space-3);
}

.table-hover tbody tr:hover[b-r03ahqhpsk] {
    background: var(--color-background-hover);
}

.table a[b-r03ahqhpsk] {
    color: var(--color-primary);
}

.table a:hover[b-r03ahqhpsk] {
    color: var(--color-primary-dark);
}

.table .badge[b-r03ahqhpsk] {
    border-radius: 999px;
    padding: 2px 10px;
    font-size: var(--text-xs);
    font-weight: 500;
}

input[type="checkbox"][b-r03ahqhpsk] {
    accent-color: var(--color-primary);
}

.sortable-header[b-r03ahqhpsk] {
    cursor: pointer;
    user-select: none;
}

.sortable-header:hover[b-r03ahqhpsk] {
    background: var(--color-background-hover) !important;
}

.sortable-header-label[b-r03ahqhpsk] {
    cursor: pointer;
    user-select: none;
}

/* REQ-WCC-089 comp B — lápiz de renombrado: visible siempre (discreto) para que sea descubrible;
   se intensifica al pasar por la columna. */
.header-edit-btn[b-r03ahqhpsk] {
    opacity: 0.45;
    transition: opacity 0.12s ease-in-out;
    font-size: 0.85em;
    vertical-align: baseline;
}

.table thead th:hover .header-edit-btn[b-r03ahqhpsk],
.header-edit-btn:focus-visible[b-r03ahqhpsk] {
    opacity: 0.9;
}

.header-edit-btn:hover[b-r03ahqhpsk] {
    opacity: 1 !important;
    color: var(--color-primary) !important;
}

.sort-icon-inactive[b-r03ahqhpsk] {
    opacity: 0.3;
    font-size: 0.7em;
    margin-left: 2px;
}

.sort-icon-active[b-r03ahqhpsk] {
    color: var(--color-primary);
    font-size: 0.8em;
    margin-left: 2px;
}

.group-header-row td[b-r03ahqhpsk] {
    background: var(--color-background) !important;
    border-bottom: 2px solid var(--color-border);
    padding: var(--space-3) var(--space-4);
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-text);
    cursor: pointer;
    user-select: none;
}

.group-header-row:hover td[b-r03ahqhpsk] {
    background: var(--color-background-hover) !important;
}

.group-header-row .badge[b-r03ahqhpsk] {
    background: var(--color-text-secondary) !important;
    font-size: var(--text-xs);
}
/* _content/WizeAdmin/Components/Pages/ResultPages/ExceptionTable.razor.rz.scp.css */
.card[b-51wtm0dkik] {
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs) !important;
    overflow: hidden;
}

.card-header[b-51wtm0dkik] {
    background: var(--color-surface) !important;
    color: var(--color-text) !important;
    border-bottom: 1px solid var(--color-border);
    padding: var(--space-4) var(--space-5);
}

.card-header .badge[b-51wtm0dkik] {
    background: var(--color-primary-subtle) !important;
    color: var(--color-primary) !important;
    border-radius: 999px;
    font-size: var(--text-xs);
    font-weight: 600;
}

.table[b-51wtm0dkik] {
    --bs-table-striped-bg: transparent;
    margin-bottom: 0;
}

.table thead th[b-51wtm0dkik] {
    background: var(--color-background);
    color: var(--color-text-secondary);
    border-bottom: 1px solid var(--color-border);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: var(--text-xs);
    padding-top: var(--space-3);
    padding-bottom: var(--space-3);
    font-weight: 600;
}

.table td[b-51wtm0dkik] {
    color: var(--color-text);
    border-color: var(--color-border);
    font-size: var(--text-sm);
    padding-top: var(--space-3);
    padding-bottom: var(--space-3);
}

.table-hover tbody tr:hover[b-51wtm0dkik] {
    background: var(--color-background-hover);
}

.table a[b-51wtm0dkik] {
    color: var(--color-primary);
}

.table a:hover[b-51wtm0dkik] {
    color: var(--color-primary-dark);
}

.table .badge[b-51wtm0dkik] {
    border-radius: 999px;
    padding: 2px 10px;
    font-size: var(--text-xs);
    font-weight: 500;
}

input[type="checkbox"][b-51wtm0dkik] {
    accent-color: var(--color-primary);
}

.sortable-header[b-51wtm0dkik] {
    cursor: pointer;
    user-select: none;
}

.sortable-header:hover[b-51wtm0dkik] {
    background: var(--color-background-hover) !important;
}

.sort-icon-inactive[b-51wtm0dkik] {
    opacity: 0.3;
    font-size: 0.7em;
    margin-left: 2px;
}

.sort-icon-active[b-51wtm0dkik] {
    color: var(--color-primary);
    font-size: 0.8em;
    margin-left: 2px;
}
/* _content/WizeAdmin/Components/Pages/ResultPages/FiltersPanel.razor.rz.scp.css */
.card[b-8vignku33o] {
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs) !important;
}

.card-header[b-8vignku33o] {
    background: var(--color-background) !important;
    border-bottom: 1px solid var(--color-border);
    padding: var(--space-4) var(--space-5);
}

.card-header h6[b-8vignku33o] {
    color: var(--color-text);
    font-size: var(--text-xl);
    font-weight: 600;
}

.card-body[b-8vignku33o] {
    padding: var(--space-5);
}

.form-label[b-8vignku33o] {
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.form-select[b-8vignku33o],
.form-control[b-8vignku33o] {
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-md);
    color: var(--color-text);
    background: var(--color-surface);
    min-height: 38px;
    font-size: var(--text-sm);
}

.form-select:focus[b-8vignku33o],
.form-control:focus[b-8vignku33o] {
    border-color: var(--color-primary-light);
    box-shadow: 0 0 0 3px var(--color-primary-subtle);
}

.btn-outline-secondary[b-8vignku33o] {
    border-color: var(--color-border-strong);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
}

.btn-outline-secondary:hover[b-8vignku33o] {
    background: var(--color-background);
    color: var(--color-text);
}

.btn-primary[b-8vignku33o] {
    background: var(--color-primary);
    border-color: var(--color-primary);
    font-size: var(--text-sm);
}

.btn-primary:hover[b-8vignku33o] {
    background: var(--color-primary-light);
    border-color: var(--color-primary-light);
}
/* _content/WizeAdmin/Components/Pages/ResultPages/GroupedExceptionTable.razor.rz.scp.css */
/* REQ-WCC-069 (FBK CEO) — toggle +/- de colapso de grupos. */
.group-toggle-pm[b-r7cp1pqec0] {
    cursor: pointer;
    color: var(--color-primary);
    user-select: none;
    display: inline-flex;
    align-items: center;
}

.group-toggle-pm:hover[b-r7cp1pqec0] {
    color: var(--color-primary-light);
}

.group-toggle-pm:focus-visible[b-r7cp1pqec0] {
    outline: 2px solid var(--color-primary-light);
    outline-offset: 2px;
    border-radius: 2px;
}
/* _content/WizeAdmin/Components/Pages/ResultPages/StatisticsPanel.razor.rz.scp.css */
#statistics-panel[b-3yvjkv0qfg] {
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs) !important;
}

#statistics-panel .card-body[b-3yvjkv0qfg] {
    padding: var(--space-4) !important;
}

#statistics-panel #statistics[b-3yvjkv0qfg] {
    row-gap: var(--space-2);
}

#statistics-panel .bg-light[b-3yvjkv0qfg] {
    background: var(--color-background) !important;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md) !important;
    min-height: 60px;
}

#statistics-panel .badge[b-3yvjkv0qfg] {
    border-radius: 999px;
    font-size: var(--text-xs);
    font-weight: 600;
}

#statistics-panel .badge.bg-success[b-3yvjkv0qfg] {
    background: var(--color-success-subtle) !important;
    color: var(--color-success) !important;
}

#statistics-panel .badge.bg-danger[b-3yvjkv0qfg] {
    background: var(--color-danger-subtle) !important;
    color: var(--color-danger) !important;
}

#statistics-panel .badge.bg-warning[b-3yvjkv0qfg] {
    background: var(--color-warning-subtle) !important;
    color: var(--color-warning) !important;
}

#statistics-panel .badge.bg-info[b-3yvjkv0qfg] {
    background: var(--color-info-subtle) !important;
    color: var(--color-info) !important;
}

#statistics-panel .badge.bg-secondary[b-3yvjkv0qfg] {
    background: var(--color-background-hover) !important;
    color: var(--color-text-secondary) !important;
}

#statistics-panel .progress[b-3yvjkv0qfg] {
    height: 6px !important;
    background: var(--color-background);
}

#statistics-panel .progress-bar[b-3yvjkv0qfg] {
    border-radius: 999px;
}

#statistics-panel .text-muted[b-3yvjkv0qfg] {
    color: var(--color-text-secondary) !important;
}
/* _content/WizeAdmin/Components/Pages/Results/Dashboard.razor.rz.scp.css */
.stat-card[b-e8jiekk4na] {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    padding: 15px;
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-xs);
    height: 100%;
}

.chart-container[b-e8jiekk4na] {
    position: relative;
    height: 150px;
    width: 100%;
}

.big-chart-container[b-e8jiekk4na] {
    height: 250px;
}

.status-badge[b-e8jiekk4na] {
    border-radius: 999px;
    padding: 5px 15px;
    font-size: 0.85rem;
    color: var(--color-text-inverse);
    text-align: center;
}

.bg-estado[b-e8jiekk4na] {
    background-color: var(--color-primary-dark);
}

.bg-resueltas[b-e8jiekk4na] {
    background-color: var(--color-accent);
}

.table thead[b-e8jiekk4na] {
    background-color: var(--color-background);
    color: var(--color-text-secondary);
}
/* _content/WizeAdmin/Components/Shared/KpiCardView.razor.rz.scp.css */
.kpi-card-v2[b-j1jf34fvcu] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
    padding: var(--space-4);
    border-left: 4px solid var(--color-border);
    display: flex;
    flex-direction: column;
    min-height: 130px;
}

.kpi-border-green[b-j1jf34fvcu] {
    border-left-color: var(--color-success);
}

.kpi-border-yellow[b-j1jf34fvcu] {
    border-left-color: var(--color-warning);
}

.kpi-border-red[b-j1jf34fvcu] {
    border-left-color: var(--color-danger);
}

.kpi-header[b-j1jf34fvcu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-1);
}

.kpi-label[b-j1jf34fvcu] {
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.kpi-delta[b-j1jf34fvcu] {
    font-size: var(--text-xs);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 1px;
}

.kpi-value[b-j1jf34fvcu] {
    font-size: var(--text-2xl);
    font-weight: 700;
    color: var(--color-text);
    margin: 0;
    line-height: 1.2;
}

.kpi-sparkline[b-j1jf34fvcu] {
    flex: 1;
    min-height: 35px;
    margin-top: var(--space-2);
}

.kpi-sparkline canvas[b-j1jf34fvcu] {
    width: 100% !important;
    height: 100% !important;
}
/* _content/WizeAdmin/Components/Shared/NotFoundContent.razor.rz.scp.css */
/* 404 branded — Wize Controls. Navy #0B3B54 fondo, acento oro #BD954E. */
.nf-overlay[b-y7h3f8c5yv] {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background: linear-gradient(160deg,
        var(--brand-navy-700, #04151F) 0%,
        var(--brand-navy-600, #0B3B54) 60%,
        var(--brand-navy-500, #135070) 100%);
    overflow: auto;
}

.nf-card[b-y7h3f8c5yv] {
    width: 100%;
    max-width: 460px;
    text-align: center;
    color: #fff;
}

.nf-logo[b-y7h3f8c5yv] {
    width: 200px;
    max-width: 70%;
    height: auto;
    margin-bottom: 2rem;
}

.nf-code[b-y7h3f8c5yv] {
    font-size: 5rem;
    font-weight: 800;
    line-height: 1;
    color: var(--brand-gold-500, #BD954E);
    letter-spacing: 0.02em;
}

.nf-title[b-y7h3f8c5yv] {
    margin-top: 0.75rem;
    font-size: 1.6rem;
    font-weight: 700;
    color: #fff;
}

.nf-subtitle[b-y7h3f8c5yv] {
    margin-top: 0.5rem;
    margin-bottom: 2rem;
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.75);
}

.nf-btn[b-y7h3f8c5yv] {
    display: inline-flex;
    align-items: center;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    text-decoration: none;
    color: var(--brand-navy-700, #04151F);
    background-color: var(--brand-gold-500, #BD954E);
    border-radius: 0.5rem;
    transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
}

.nf-btn:hover[b-y7h3f8c5yv] {
    background-color: var(--brand-gold-300, #D4B377);
    transform: translateY(-1px);
}
/* _content/WizeAdmin/Components/Shared/StatusBadge.razor.rz.scp.css */
/* REQ-047 §3 — Badge Default/Custom/NA */

.status-badge[b-khg51tc57s] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.6rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.status-badge i[b-khg51tc57s] { font-size: 0.85rem; }

.status-badge-default[b-khg51tc57s] {
    background-color: var(--brand-navy-50);
    color: var(--brand-navy-600);
    border: 1px solid transparent;
}

.status-badge-custom[b-khg51tc57s] {
    background-color: var(--brand-gold-50);
    color: var(--brand-gold-700);
    border: 1px solid var(--brand-gold-200);
}

.status-badge-na[b-khg51tc57s] {
    background-color: transparent;
    color: var(--brand-navy-400);
    border: 1px dashed var(--brand-navy-200);
}

@media (prefers-reduced-motion: reduce) {
    .status-badge[b-khg51tc57s] { transition: none; }
}
