@import '_content/NetOffice.Web.Forms/NetOffice.Web.Forms.yalyic8oju.bundle.scp.css';

/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-wlmy464nb0] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-wlmy464nb0] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Seguimiento/BarHChart.razor.rz.scp.css */
/* BarHChart — barras horizontales en grid de 3 columnas:
   etiqueta · barra · valor. El valor SIEMPRE fuera de la barra,
   garantizando legibilidad sobre cualquier color de fondo. */

.bh-chart[b-gyh9yxl4vj] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 4px 0;
}

.bh-row[b-gyh9yxl4vj] {
    display: grid;
    grid-template-columns: 160px 1fr 165px;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    color: #1f2c3d;
    padding: 2px 6px;
    margin: 0 -6px;
    border-radius: 4px;
    transition: background 0.12s, box-shadow 0.12s;
}

/* Filas clicables (cuando OnSelect está cableado en el ranking).
   Cursor pointer + hover sutil para invitar al clic. */
.bh-row.clickable[b-gyh9yxl4vj] { cursor: pointer; }
.bh-row.clickable:hover[b-gyh9yxl4vj] {
    background: #f4f8fd;
}

/* Fila resaltada — la del item actualmente seleccionado en el sidebar.
   Borde lateral azul + fondo gradiente sutil para que se vea de un golpe
   cuál es el seleccionado dentro del ranking. */
.bh-row.selected[b-gyh9yxl4vj] {
    background: linear-gradient(90deg, rgba(31,74,135,0.10) 0%, rgba(31,74,135,0.02) 100%);
    box-shadow: inset 3px 0 0 #1f4a87;
    padding-left: 12px;
    margin-left: -12px;
}
.bh-row.selected .bh-lbl[b-gyh9yxl4vj] {
    color: #1f4a87;
    font-weight: 800;
}

.bh-lbl[b-gyh9yxl4vj] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
    color: #1f2c3d;
}

.bh-bar-wrap[b-gyh9yxl4vj] {
    background: #eef2f8;
    border-radius: 4px;
    height: 22px;
    overflow: hidden;
    display: flex;
    align-items: center;
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.04);
}

.bh-bar[b-gyh9yxl4vj] {
    height: 100%;
    border-radius: 4px;
    background: #1f4a87;
    transition: width 0.4s ease-out;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.bh-val[b-gyh9yxl4vj] {
    color: #1f2c3d;
    font-weight: 700;
    font-size: 12px;
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bh-empty[b-gyh9yxl4vj] {
    color: #6c7787;
    font-size: 12px;
    font-style: italic;
    text-align: center;
    margin: 16px 0;
}

@media (max-width: 1280px) {
    .bh-row[b-gyh9yxl4vj] { grid-template-columns: 130px 1fr 140px; }
}
/* /Components/Seguimiento/CoberturaValidacionesPanel.razor.rz.scp.css */
/* CoberturaValidacionesPanel — dashboard de cobertura de validaciones (T4).
   Cabecera estilo paneles del shell (th-/st-) + cuerpo calcado del dashboard
   "Cobertura T6" de Videos formativos (vfa-cob), con prefijo cvt-.
   Mapa de color:
     verde  #1f9d55  → verificada
     ámbar  #e0a800  → verificación caída
     gris   #9aa7b8  → sin verificar  */

.cvt-page[b-3671kh0k0s] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    background: #f4f6fa;
    overflow: hidden;
    position: relative;
}

/* ── Cabecera ── */
.cvt-head[b-3671kh0k0s] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 18px;
    background: linear-gradient(180deg, #ffffff 0%, #eef3fa 100%);
    border-bottom: 1px solid #d2dbe6;
    box-shadow: 0 1px 3px rgba(15, 30, 55, 0.06);
}

.cvt-head-title[b-3671kh0k0s] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #1f2c3d;
}

.cvt-head-title h2[b-3671kh0k0s] {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.2px;
}

.cvt-head-title i.bi-shield-fill-check[b-3671kh0k0s] {
    font-size: 22px;
    color: #1f9d55;
}

.cvt-loading[b-3671kh0k0s] {
    font-size: 12.5px;
    color: #6b7a8d;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.cvt-head-actions[b-3671kh0k0s] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cvt-refresh[b-3671kh0k0s],
.cvt-back[b-3671kh0k0s] {
    border: 1px solid #c9ced4;
    background: #fff;
    color: #1f4a87;
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 13px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background .15s, box-shadow .15s;
}

.cvt-refresh[b-3671kh0k0s] { padding: 7px 10px; }
.cvt-refresh:hover[b-3671kh0k0s],
.cvt-back:hover[b-3671kh0k0s] { background: #eef3fa; box-shadow: 0 2px 6px rgba(31, 74, 135, .12); }

/* ── Cuerpo deslizable ── */
/* Cabecera fija (flex:0 0 auto) + cuerpo con scroll propio. min-height:0 es
   imprescindible: sin él, el hijo flex no encoge y el contenido se corta abajo
   en vez de scrollear (era justo el bug reportado). El padding lateral da el
   margen que antes ponían los bloques individuales. */
.cvt-body[b-3671kh0k0s] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 0 18px 14px;
}

.cvt-empty[b-3671kh0k0s] {
    margin-top: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: #6b7a8d;
    text-align: center;
}

.cvt-empty i[b-3671kh0k0s] { font-size: 34px; color: #b7c2d0; }
.cvt-empty strong[b-3671kh0k0s] { font-size: 15px; color: #45556a; }
.cvt-empty span[b-3671kh0k0s] { font-size: 13px; max-width: 460px; }

.cvt-spin[b-3671kh0k0s] { animation: cvt-spin-b-3671kh0k0s 1s linear infinite; }
@keyframes cvt-spin-b-3671kh0k0s { to { transform: rotate(360deg); } }

/* ── KPIs ── */
.cvt-kpis[b-3671kh0k0s] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
    margin-top: 16px;
    margin-bottom: 16px;
}

.cvt-kpi[b-3671kh0k0s] {
    background: #fff;
    border: 1px solid #e2e9f1;
    border-radius: 12px;
    padding: 14px 16px;
    box-shadow: 0 1px 3px rgba(20, 34, 52, .05);
}

.cvt-kpi .n[b-3671kh0k0s] { font-size: 28px; font-weight: 800; line-height: 1; }
.cvt-kpi .l[b-3671kh0k0s] { font-size: 12px; color: #6b7a8d; margin-top: 5px; }
.cvt-kpi.tot .n[b-3671kh0k0s] { color: #2f5fb0; }
.cvt-kpi.ok .n[b-3671kh0k0s] { color: #1f9d55; }
.cvt-kpi.caida .n[b-3671kh0k0s] { color: #e0a800; }
.cvt-kpi.pend .n[b-3671kh0k0s] { color: #9aa7b8; }
.cvt-kpi.prev .n[b-3671kh0k0s] { color: #2f8f7d; }
.cvt-kpi.antes .n[b-3671kh0k0s] { color: #2f6fb0; }
.cvt-kpi.pct .n[b-3671kh0k0s] { color: #1f4a87; }

/* ── Barra de progreso global ── */
.cvt-mega[b-3671kh0k0s] {
    background: #fff;
    border: 1px solid #e2e9f1;
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 18px;
}

.cvt-track[b-3671kh0k0s] {
    height: 15px;
    border-radius: 8px;
    background: #eef2f7;
    display: flex;
    overflow: hidden;
}

.cvt-track i[b-3671kh0k0s] { display: block; height: 100%; }
.cvt-track .s-ok[b-3671kh0k0s] { background: #1f9d55; }
.cvt-track .s-caida[b-3671kh0k0s] { background: #e0a800; }
.cvt-track .s-antes[b-3671kh0k0s] { background: #5887c9; }
.cvt-track .s-pend[b-3671kh0k0s] { background: #dde5ee; }

.cvt-leg[b-3671kh0k0s] {
    display: flex;
    gap: 18px;
    margin-top: 10px;
    font-size: 12px;
    color: #6b7a8d;
    align-items: center;
    flex-wrap: wrap;
}

.cvt-leg b[b-3671kh0k0s] {
    display: inline-block;
    width: 11px;
    height: 11px;
    border-radius: 3px;
    margin-right: 5px;
    vertical-align: -1px;
}

.cvt-leg b.b-ok[b-3671kh0k0s] { background: #1f9d55; }
.cvt-leg b.b-caida[b-3671kh0k0s] { background: #e0a800; }
.cvt-leg b.b-antes[b-3671kh0k0s] { background: #5887c9; }
.cvt-leg b.b-pend[b-3671kh0k0s] { background: #dde5ee; }
.cvt-leg-pct[b-3671kh0k0s] { margin-left: auto; font-weight: 700; color: #1f4a87; }

/* ── Tarjetas por módulo ── */
.cvt-h3[b-3671kh0k0s] { font-size: 14px; color: #1f4a87; margin: 6px 0 10px; }
.cvt-h3 .cvt-muted[b-3671kh0k0s] { font-weight: 400; font-size: 12px; }

.cvt-mods[b-3671kh0k0s] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 10px;
    margin-bottom: 20px;
}

.cvt-mod[b-3671kh0k0s] {
    background: #fff;
    border: 1px solid #e2e9f1;
    border-radius: 10px;
    padding: 11px 13px;
    cursor: pointer;
    transition: box-shadow .15s;
}

.cvt-mod:hover[b-3671kh0k0s] { box-shadow: 0 4px 14px rgba(47, 95, 176, .16); }
.cvt-mod.sel[b-3671kh0k0s] { outline: 2px solid #2f5fb0; }
.cvt-mod .top[b-3671kh0k0s] { display: flex; justify-content: space-between; align-items: baseline; }
.cvt-mod .name[b-3671kh0k0s] { font-weight: 700; font-size: 13px; }
.cvt-mod .cnt[b-3671kh0k0s] { font-size: 12px; color: #6b7a8d; }
.cvt-mod .bar[b-3671kh0k0s] { height: 7px; border-radius: 5px; background: #eef2f7; margin-top: 8px; overflow: hidden; }
.cvt-mod .bar i[b-3671kh0k0s] { display: block; height: 100%; background: linear-gradient(90deg, #1f9d55, #36b56a); }
.cvt-mod .pct[b-3671kh0k0s] { font-size: 11px; color: #6b7a8d; margin-top: 5px; }

/* ── Toolbar de filtros ── */
.cvt-toolbar[b-3671kh0k0s] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.cvt-search-wrap[b-3671kh0k0s] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #fff;
    border: 1px solid #e2e9f1;
    border-radius: 8px;
    padding: 0 10px;
}

.cvt-search-wrap i[b-3671kh0k0s] { color: #9aa7b8; font-size: 13px; }

.cvt-search[b-3671kh0k0s] {
    border: 0;
    outline: 0;
    padding: 8px 4px;
    font-size: 13px;
    min-width: 200px;
    background: transparent;
    color: #1c2b3a;
}

.cvt-sel[b-3671kh0k0s] {
    border: 1px solid #e2e9f1;
    border-radius: 8px;
    padding: 8px 10px;
    font-size: 13px;
    background: #fff;
    color: #1c2b3a;
}

.cvt-check[b-3671kh0k0s] {
    font-size: 13px;
    color: #6b7a8d;
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.cvt-spacer[b-3671kh0k0s] { flex: 1 1 auto; }
.cvt-count[b-3671kh0k0s] { font-size: 12px; color: #6b7a8d; white-space: nowrap; }

/* ── Tabla ── */
.cvt-tablewrap[b-3671kh0k0s] {
    border: 1px solid #e2e9f1;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}

.cvt-table[b-3671kh0k0s] { width: 100%; border-collapse: collapse; }

.cvt-table th[b-3671kh0k0s] {
    text-align: left;
    padding: 9px 14px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: #6b7a8d;
    background: #f7f9fc;
    font-weight: 600;
    border-bottom: 1px solid #eef3f8;
}

.cvt-table td[b-3671kh0k0s] {
    padding: 8px 14px;
    font-size: 13px;
    border-bottom: 1px solid #eef3f8;
    color: #1c2b3a;
}

.cvt-table tbody tr.cvt-row[b-3671kh0k0s] { cursor: pointer; }
.cvt-table tbody tr.cvt-row:hover td[b-3671kh0k0s] { background: #f9fbfe; }

.cvt-caret[b-3671kh0k0s] { font-size: 10px; margin-right: 6px; color: #2f5fb0; }
.cvt-pant[b-3671kh0k0s] { font-weight: 500; }
.cvt-modtag[b-3671kh0k0s] { font-size: 11px; color: #1f4a87; background: #eaf1fc; border-radius: 9px; padding: 2px 8px; }
.cvt-submenu[b-3671kh0k0s] { display: flex; align-items: center; gap: 2px; margin-top: 4px; font-size: 11px; color: #6b7a8d; }
.cvt-submenu i[b-3671kh0k0s] { font-size: 9px; color: #9aa8ba; }

.cvt-tipotag[b-3671kh0k0s] {
    font-size: 10.5px;
    border-radius: 9px;
    padding: 2px 8px;
    background: #eef2f7;
    color: #5a6b80;
}
.cvt-tipotag.cvt-tipo-formulario[b-3671kh0k0s] { background: #eaf1fc; color: #1f4a87; }
.cvt-tipotag.cvt-tipo-utilidad[b-3671kh0k0s] { background: #fdf0e3; color: #b06a12; }
.cvt-tipotag.cvt-tipo-rcl[b-3671kh0k0s] { background: #ede9fe; color: #6d28d9; }
.cvt-tipotag.cvt-tipo-api[b-3671kh0k0s] { background: #e3f4ee; color: #1f7a55; }
.cvt-tipotag.cvt-tipo-infra[b-3671kh0k0s] { background: #f0eef0; color: #6b5a6b; }

.cvt-pill[b-3671kh0k0s] {
    font-size: 11px;
    padding: 2px 9px;
    border-radius: 11px;
    color: #fff;
    white-space: nowrap;
}

.cvt-pill.ok[b-3671kh0k0s] { background: #1f9d55; }
.cvt-pill.caida[b-3671kh0k0s] { background: #e0a800; }
.cvt-pill.antes[b-3671kh0k0s] { background: #5887c9; }
.cvt-pill.pend[b-3671kh0k0s] { background: #9aa7b8; }

.cvt-ult[b-3671kh0k0s] { display: inline-flex; align-items: center; gap: 6px; }
.cvt-ttag[b-3671kh0k0s] {
    font-size: 10px;
    font-weight: 700;
    border-radius: 6px;
    padding: 1px 6px;
    background: #eef2f7;
    color: #5a6b80;
}
.cvt-ttag.cvt-t4[b-3671kh0k0s] { background: #e3f4ee; color: #1f7a55; }
.cvt-muted[b-3671kh0k0s] { color: #9aa7b8; font-size: 11.5px; }

/* ── Detalle expandible ── */
.cvt-detail td[b-3671kh0k0s] { background: #fbfcfe; padding: 0 14px; }
.cvt-detail-load[b-3671kh0k0s],
.cvt-detail-empty[b-3671kh0k0s] { color: #6b7a8d; font-size: 12.5px; padding: 12px 0 14px 26px; }

.cvt-detail-head[b-3671kh0k0s] {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    padding: 12px 0 8px 26px;
}

.cvt-detail-stat[b-3671kh0k0s] {
    font-size: 12.5px;
    color: #45556a;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.cvt-detail-stat i[b-3671kh0k0s] { color: #1f9d55; }
.cvt-detail-stat strong[b-3671kh0k0s] { color: #1c2b3a; }

.cvt-hist[b-3671kh0k0s] {
    width: calc(100% - 26px);
    margin: 0 0 12px 26px;
    border-collapse: collapse;
    background: #fff;
    border: 1px solid #ece8f1;
    border-radius: 8px;
    overflow: hidden;
}

.cvt-hist th[b-3671kh0k0s] {
    text-align: left;
    padding: 6px 10px;
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: .3px;
    color: #6b7a8d;
    background: #f7f9fc;
    font-weight: 600;
}

.cvt-hist td[b-3671kh0k0s] {
    padding: 6px 10px;
    font-size: 12.5px;
    border-top: 1px solid #f0f3f7;
    color: #1c2b3a;
}

.cvt-hist-com[b-3671kh0k0s] {
    color: #5a6b80;
    max-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cvt-caida-box[b-3671kh0k0s] {
    margin: 0 0 12px 26px;
    padding: 9px 12px;
    background: #fdf6e3;
    border: 1px solid #f3e2b3;
    border-radius: 8px;
    font-size: 12.5px;
    color: #8a6d12;
}
.cvt-caida-box i[b-3671kh0k0s] { color: #e0a800; margin-right: 6px; }

.cvt-empty-inline[b-3671kh0k0s] {
    text-align: center;
    color: #9aa7b8;
    font-size: 13px;
    padding: 18px 0;
}

.cvt-foot[b-3671kh0k0s] { color: #6b7a8d; font-size: 11.5px; text-align: center; margin: 14px 0 8px; }

/* ── T4 por persona ── */
.cvt-pers-list[b-3671kh0k0s] { display: flex; flex-direction: column; gap: 8px; margin-bottom: 18px; }
.cvt-pers-row[b-3671kh0k0s] {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border: 1px solid #e2e9f1;
    border-radius: 10px;
    padding: 10px 13px;
}
.cvt-pers-av[b-3671kh0k0s] {
    width: 38px; height: 38px; flex: 0 0 auto;
    border-radius: 50%;
    background: #eaf1fc; color: #1f4a87;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 13px;
}
.cvt-pers-main[b-3671kh0k0s] { flex: 1 1 auto; min-width: 0; }
.cvt-pers-top[b-3671kh0k0s] { display: flex; align-items: baseline; gap: 8px; }
.cvt-pers-name[b-3671kh0k0s] { font-weight: 700; font-size: 13px; color: #1c2b3a; }
.cvt-pers-bar[b-3671kh0k0s] { height: 8px; border-radius: 5px; background: #eef2f7; margin-top: 7px; overflow: hidden; }
.cvt-pers-bar i[b-3671kh0k0s] { display: block; height: 100%; background: linear-gradient(90deg, #1f9d55, #36b56a); }
.cvt-pers-sub[b-3671kh0k0s] { font-size: 11.5px; color: #9aa7b8; margin-top: 5px; display: flex; align-items: center; flex-wrap: wrap; }
.cvt-pers-stat[b-3671kh0k0s] { text-align: right; flex: 0 0 auto; }
.cvt-pers-h[b-3671kh0k0s] { font-size: 16px; font-weight: 700; color: #1c2b3a; }
.cvt-pers-pct[b-3671kh0k0s] { font-size: 11.5px; color: #6b7a8d; }

/* ── T4 por persona: KPIs de la sección ── */
.cvt-pers-kpis[b-3671kh0k0s] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}
.cvt-pk[b-3671kh0k0s] {
    background: #fff;
    border: 1px solid #e2e9f1;
    border-radius: 10px;
    padding: 11px 13px;
    box-shadow: 0 1px 3px rgba(20, 34, 52, .05);
}
.cvt-pk .n[b-3671kh0k0s] { font-size: 22px; font-weight: 800; line-height: 1.1; color: #1f4a87; }
.cvt-pk .n.cvt-pk-name[b-3671kh0k0s] { font-size: 15px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cvt-pk .l[b-3671kh0k0s] { font-size: 11.5px; color: #6b7a8d; margin-top: 5px; }

/* ── Medalla de ranking sobre el avatar ── */
.cvt-pers-av[b-3671kh0k0s] { position: relative; }
.cvt-pers-av.rank-1[b-3671kh0k0s] { background: #fdf3d2; color: #8a6d12; }
.cvt-pers-av.rank-2[b-3671kh0k0s] { background: #eef1f5; color: #5a6b80; }
.cvt-pers-av.rank-3[b-3671kh0k0s] { background: #f6e8de; color: #9a5b2c; }
.cvt-pers-rank[b-3671kh0k0s] {
    position: absolute; top: -4px; right: -4px;
    width: 17px; height: 17px;
    border-radius: 50%;
    background: #1f4a87; color: #fff;
    font-size: 10px; font-weight: 700;
    display: flex; align-items: center; justify-content: center;
    border: 2px solid #fff;
}
.cvt-pers-av.rank-1 .cvt-pers-rank[b-3671kh0k0s] { background: #e0a800; }

.cvt-pers-when[b-3671kh0k0s] {
    font-size: 11px; color: #9aa7b8;
    display: inline-flex; align-items: center; gap: 4px;
    margin-left: auto;
}
.cvt-pers-when i[b-3671kh0k0s] { font-size: 10.5px; }

/* ── Mezcla T1-T5 (mini barra apilada en el subtítulo) ── */
.cvt-mezcla[b-3671kh0k0s] {
    display: inline-flex;
    width: 92px; height: 6px;
    border-radius: 4px; overflow: hidden;
    margin-left: 10px; vertical-align: middle;
    background: #eef2f7;
}
.cvt-mezcla i[b-3671kh0k0s] { display: block; height: 100%; }

/* ── Reparto de la cobertura verificada por validador ── */
.cvt-cob-bar[b-3671kh0k0s] {
    display: flex;
    height: 16px;
    border-radius: 8px;
    overflow: hidden;
    background: #eef2f7;
    margin-bottom: 10px;
}
.cvt-cob-bar i[b-3671kh0k0s] { display: block; height: 100%; }
.cvt-cob-leg[b-3671kh0k0s] {
    display: flex; flex-wrap: wrap; gap: 12px;
    font-size: 12px; color: #6b7a8d;
    margin-bottom: 18px;
}
.cvt-cob-item[b-3671kh0k0s] { display: inline-flex; align-items: center; gap: 5px; }
.cvt-cob-item b[b-3671kh0k0s] { width: 11px; height: 11px; border-radius: 3px; display: inline-block; }

/* ── Aviso de faltantes (hojas del menú sin objeto en el catálogo) ── */
.cvt-faltan[b-3671kh0k0s] {
    background: #fff8e8;
    border: 1px solid #f0dca6;
    border-radius: 12px;
    margin-bottom: 18px;
    overflow: hidden;
}

.cvt-faltan-head[b-3671kh0k0s] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 15px;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
    font-size: 13px;
    color: #7a5a00;
}

.cvt-faltan-head i.bi-exclamation-triangle-fill[b-3671kh0k0s] { font-size: 16px; color: #d19a00; flex: 0 0 auto; }
.cvt-faltan-head strong[b-3671kh0k0s] { font-size: 15px; color: #8a5a00; }
.cvt-faltan-txt[b-3671kh0k0s] { flex: 1 1 auto; }
.cvt-faltan-caret[b-3671kh0k0s] { flex: 0 0 auto; color: #b08a2a; }

.cvt-faltan-list[b-3671kh0k0s] {
    padding: 4px 15px 14px;
    border-top: 1px solid #f0e2b8;
    max-height: 340px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cvt-faltan-mod[b-3671kh0k0s] { }
.cvt-faltan-modname[b-3671kh0k0s] {
    font-size: 12px;
    font-weight: 700;
    color: #5a4a1a;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin: 6px 0 4px;
}

.cvt-faltan-item[b-3671kh0k0s] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 3px 0 3px 10px;
    font-size: 12.5px;
    color: #3f4a58;
    border-left: 2px solid #f0dca6;
}

.cvt-faltan-lbl[b-3671kh0k0s] { font-weight: 600; color: #2b3644; }
.cvt-faltan-sub[b-3671kh0k0s] { font-size: 11.5px; color: #8a7a4a; display: inline-flex; align-items: center; gap: 3px; }
.cvt-faltan-path[b-3671kh0k0s] {
    margin-left: auto;
    font-family: Consolas, "Cascadia Code", monospace;
    font-size: 11px;
    color: #9aa0a8;
    white-space: nowrap;
}
/* /Components/Seguimiento/DonutChart.razor.rz.scp.css */
/* DonutChart — círculo con leyenda al lado. */

.dn-wrap[b-kxo96tqq91] {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 16px;
    align-items: center;
}

.dn-svg[b-kxo96tqq91] {
    width: 140px;
    height: 140px;
    display: block;
}

.dn-legend[b-kxo96tqq91] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 12px;
    color: #1f2c3d;
}

.dn-legend li[b-kxo96tqq91] {
    display: grid;
    grid-template-columns: 12px 1fr auto;
    align-items: center;
    gap: 8px;
}

.dn-dot[b-kxo96tqq91] {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06);
}

.dn-lbl[b-kxo96tqq91] {
    font-weight: 600;
}

.dn-val[b-kxo96tqq91] {
    color: #4a5566;
    font-variant-numeric: tabular-nums;
}

.dn-pct[b-kxo96tqq91] {
    color: #8a93a3;
    font-size: 11px;
}

.dn-empty[b-kxo96tqq91] {
    color: #6c7787;
    font-size: 12px;
    font-style: italic;
    text-align: center;
    margin: 16px 0;
}

@media (max-width: 1280px) {
    .dn-wrap[b-kxo96tqq91] { grid-template-columns: 110px 1fr; }
    .dn-svg[b-kxo96tqq91] { width: 110px; height: 110px; }
}
/* /Components/Seguimiento/SerieMensualChart.razor.rz.scp.css */
/* SerieMensualChart — sparkline de evolución mensual. */

.ser-svg[b-2n2itlo7g4] {
    width: 100%;
    height: 140px;
    display: block;
}

.ser-empty[b-2n2itlo7g4] {
    color: #6c7787;
    font-size: 12px;
    font-style: italic;
    text-align: center;
    margin: 16px 0;
}
/* /Components/Seguimiento/SoportePanel.razor.rz.scp.css */
/* Mesa de soporte — estilo "Estadísticas · Programadores", a pantalla completa. */
.sop-page[b-crys2twceg]{box-sizing:border-box;padding:16px 24px 30px;width:100%;max-width:100%;overflow-x:hidden;font-family:"Segoe UI",system-ui,sans-serif;color:#1c2b3a}
.sop-page *[b-crys2twceg]{box-sizing:border-box}

.sop-head[b-crys2twceg]{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.sop-head-l[b-crys2twceg]{display:flex;align-items:center;gap:12px}
.sop-head-l > i[b-crys2twceg]{font-size:26px;color:#2f5fb0}
.sop-head h2[b-crys2twceg]{margin:0;font-size:19px;color:#1f4a87}
.sop-sub[b-crys2twceg]{font-size:12.5px;color:#6b7a8d}
.sop-toptabs[b-crys2twceg]{display:flex;gap:6px;margin-left:auto;background:#f1f5fa;border-radius:9px;padding:4px}
.sop-toptabs button[b-crys2twceg]{border:0;background:transparent;padding:7px 14px;border-radius:7px;font-size:13px;cursor:pointer;color:#6b7a8d}
.sop-toptabs button.on[b-crys2twceg]{background:#fff;color:#1f4a87;font-weight:700;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.sop-close[b-crys2twceg]{border:1px solid #dde5ee;background:#fff;border-radius:8px;width:34px;height:34px;cursor:pointer;color:#556}
.sop-close:hover[b-crys2twceg]{background:#f1f5fa}

/* ---- Barra superior: filtros de fecha + KPIs ---- */
.sop-topbar[b-crys2twceg]{display:flex;flex-direction:column;gap:12px;margin-bottom:16px;width:100%}
.sop-datefilter[b-crys2twceg]{order:1;display:flex;align-items:center;gap:8px;justify-content:flex-end;flex-wrap:wrap;width:100%;max-width:100%}
.df-lbl[b-crys2twceg]{font-size:12px;color:#6b7a8d}
.sop-datefilter input[type=date][b-crys2twceg]{border:1px solid #dde5ee;border-radius:8px;padding:6px 9px;font-size:13px;background:#fff}
.df-quick[b-crys2twceg]{display:flex;gap:4px;background:#f1f5fa;border-radius:9px;padding:3px;margin-left:6px}
.df-quick button[b-crys2twceg]{border:0;background:transparent;padding:6px 12px;border-radius:7px;font-size:12.5px;cursor:pointer;color:#6b7a8d}
.df-quick button.on[b-crys2twceg]{background:#fff;color:#1f4a87;font-weight:700;box-shadow:0 1px 3px rgba(0,0,0,.1)}

.sop-kpibar[b-crys2twceg]{order:2;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;width:100%}
.sop-kpibar.cob[b-crys2twceg]{grid-template-columns:repeat(4,minmax(0,1fr))}
.sop-kpi[b-crys2twceg]{background:#fff;border:1px solid #e2e9f1;border-radius:12px;padding:14px 18px;box-shadow:0 1px 3px rgba(20,34,52,.05);border-top:3px solid #cbd6e3}
.sop-kpi .n[b-crys2twceg]{font-size:30px;font-weight:800;line-height:1}
.sop-kpi .l[b-crys2twceg]{font-size:12px;color:#6b7a8d;margin-top:6px}
.sop-kpi.tot[b-crys2twceg]{border-top-color:#2f5fb0}.sop-kpi.tot .n[b-crys2twceg]{color:#2f5fb0}
.sop-kpi.ok[b-crys2twceg]{border-top-color:#1f9d55}.sop-kpi.ok .n[b-crys2twceg]{color:#1f9d55}
.sop-kpi.pend[b-crys2twceg]{border-top-color:#d6453d}.sop-kpi.pend .n[b-crys2twceg]{color:#d6453d}
.sop-kpi.done[b-crys2twceg]{border-top-color:#2f6ec1}.sop-kpi.done .n[b-crys2twceg]{color:#2f6ec1}
.sop-kpi.auto[b-crys2twceg]{border-top-color:#6e3fc0}.sop-kpi.auto .n[b-crys2twceg]{color:#6e3fc0}
.sop-kpi.rev[b-crys2twceg]{border-top-color:#e0a800}.sop-kpi.rev .n[b-crys2twceg]{color:#e0a800}
.sop-kpi.clickable[b-crys2twceg]{cursor:pointer;transition:box-shadow .15s}
.sop-kpi.clickable:hover[b-crys2twceg]{box-shadow:0 4px 14px rgba(214,69,61,.2)}
.sop-kpi.clickable.sel[b-crys2twceg]{outline:2px solid #d6453d}

/* ---- Desk: rail + tabla, full width ---- */
.sop-desk[b-crys2twceg]{display:grid;grid-template-columns:300px 1fr;gap:18px;align-items:start}

.sop-rail[b-crys2twceg]{display:flex;flex-direction:column;gap:7px}
.sop-ag[b-crys2twceg]{display:flex;align-items:center;gap:11px;width:100%;text-align:left;border:1px solid #e2e9f1;background:#fff;border-radius:11px;padding:11px 13px;cursor:pointer;transition:box-shadow .15s}
.sop-ag:hover[b-crys2twceg]{box-shadow:0 3px 12px rgba(47,95,176,.14)}
.sop-ag.sel[b-crys2twceg]{outline:2px solid #2f5fb0;background:#f4f8ff}
.sop-ag .ico[b-crys2twceg]{width:38px;height:38px;border-radius:9px;display:grid;place-items:center;background:#eef2f7;color:#5a6b7e;font-size:17px;flex:0 0 38px}
.sop-ag.ia .ico[b-crys2twceg]{background:#e7dcff;color:#6e3fc0}
.sop-ag .t[b-crys2twceg]{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.sop-ag .t b[b-crys2twceg]{font-size:14px}
.sop-ag .t small[b-crys2twceg]{font-size:11.5px;color:#8aa0b6}
.sop-rail-sep[b-crys2twceg]{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#9aa7b8;margin:12px 4px 2px;font-weight:600}
.sop-rail-empty[b-crys2twceg]{font-size:12px;color:#9aa7b8;padding:8px 4px}

/* Bloque destacado: SIN RESOLVER (cola) */
.sop-queue[b-crys2twceg]{width:100%;text-align:left;border:0;border-radius:12px;padding:13px 15px;cursor:pointer;color:#fff;
           box-shadow:0 4px 14px rgba(214,69,61,.3);transition:transform .12s, box-shadow .15s}
.sop-queue.hot[b-crys2twceg]{background:linear-gradient(135deg,#e8533f,#c5372a)}
.sop-queue.ok[b-crys2twceg]{background:linear-gradient(135deg,#1f9d55,#178043);box-shadow:0 4px 14px rgba(31,157,85,.25)}
.sop-queue:hover[b-crys2twceg]{transform:translateY(-1px)}
.sop-queue.sel[b-crys2twceg]{outline:3px solid #1c2b3a;outline-offset:2px}
.sop-queue .q-top[b-crys2twceg]{display:flex;align-items:center;gap:9px}
.sop-queue .q-top i[b-crys2twceg]{font-size:18px}
.sop-queue .q-lbl[b-crys2twceg]{font-weight:800;letter-spacing:.6px;font-size:13.5px}
.sop-queue .q-n[b-crys2twceg]{margin-left:auto;font-size:24px;font-weight:900;line-height:1}
.sop-queue .q-sub[b-crys2twceg]{font-size:11.5px;opacity:.92;margin-top:5px}
.ag-curso[b-crys2twceg]{font-size:10.5px;font-weight:700;color:#b9770e;background:#fdebd0;border-radius:10px;padding:2px 8px;white-space:nowrap}

.sop-deskmain[b-crys2twceg]{min-width:0}
.sop-deskhead[b-crys2twceg]{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}
.sop-deskhead h3[b-crys2twceg]{margin:0;font-size:16px;color:#1f4a87}
.sop-cnt[b-crys2twceg]{font-size:12px;color:#9aa7b8}

.sop-tablewrap[b-crys2twceg]{width:100%;overflow-x:auto;border:1px solid #e2e9f1;border-radius:12px}
.sop-table[b-crys2twceg]{width:100%;border-collapse:collapse;background:#fff;min-width:980px}
.sop-table th[b-crys2twceg],.sop-table td[b-crys2twceg]{text-align:left;padding:9px 13px;font-size:13px;border-bottom:1px solid #eef3f8;vertical-align:top}
.sop-table thead tr:first-child th[b-crys2twceg]{background:#f7f9fc;color:#6b7a8d;font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.4px}
.sop-filtrow th[b-crys2twceg]{background:#fff;padding:6px 9px}
.sop-filtrow input[b-crys2twceg]{width:100%;border:1px solid #e2e9f1;border-radius:6px;padding:5px 8px;font-size:12px;background:#fbfdff}
.sop-table tbody tr:last-child td[b-crys2twceg]{border-bottom:0}
.sop-table tbody tr:hover td[b-crys2twceg]{background:#f9fbfe}
.sop-muted[b-crys2twceg]{color:#6b7a8d}
.sop-cli[b-crys2twceg]{font-size:11px;color:#1f4a87;background:#eaf1fc;border-radius:8px;padding:1px 6px;margin-left:6px}
.sop-msg[b-crys2twceg]{max-width:420px;color:#33414f}
.sop-remit[b-crys2twceg]{font-size:10.5px;color:#6b7a8d;margin-top:4px;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sop-orig[b-crys2twceg]{font-size:11px;padding:2px 9px;border-radius:11px;color:#fff;white-space:nowrap}
.sop-orig.email[b-crys2twceg]{background:#2f6ec1}
.sop-orig.whatsapp[b-crys2twceg]{background:#1fa855}
.sop-orig.voz[b-crys2twceg]{background:#b9770e}
.sop-orig.tapiz[b-crys2twceg]{background:#6e3fc0}
.sop-pant[b-crys2twceg]{max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sop-resol[b-crys2twceg]{max-width:300px;color:#475}
.sop-pill[b-crys2twceg]{font-size:11px;padding:2px 9px;border-radius:11px;color:#fff;white-space:nowrap}
.sop-pill.ok[b-crys2twceg]{background:#1f9d55}
.sop-pill.rev[b-crys2twceg]{background:#e0a800}
.sop-pill.pend[b-crys2twceg]{background:#9aa7b8}
.sop-pill.done[b-crys2twceg]{background:#2f6ec1}
.sop-pill.curso[b-crys2twceg]{background:#6e3fc0}
.sop-acc[b-crys2twceg]{white-space:nowrap}
.sop-btn[b-crys2twceg]{border:0;border-radius:7px;padding:6px 12px;font-size:12px;font-weight:700;cursor:pointer;color:#fff}
.sop-btn.atender[b-crys2twceg]{background:#e8533f}
.sop-btn.atender:hover[b-crys2twceg]{background:#d23f2c}
.sop-btn.resolver[b-crys2twceg]{background:#1f9d55}
.sop-btn.resolver:hover[b-crys2twceg]{background:#178043}
.sop-btn.cancelar[b-crys2twceg]{background:#eef2f7;color:#556}
.sop-btn.ia[b-crys2twceg]{background:#6e3fc0}
.sop-btn.ia:hover[b-crys2twceg]{background:#5a32a3}
.sop-btn:disabled[b-crys2twceg]{opacity:.5;cursor:wait}

/* Modal de asignación */
.sop-modalback[b-crys2twceg]{position:fixed;inset:0;background:rgba(20,34,52,.45);z-index:60;display:flex;align-items:center;justify-content:center}
.sop-modal[b-crys2twceg]{width:460px;max-width:92vw;background:#fff;border-radius:14px;padding:20px 22px;box-shadow:0 24px 70px rgba(0,0,0,.4)}
.sop-modal h4[b-crys2twceg]{margin:0 0 10px;color:#1f4a87;font-size:16px}
.sop-modal-cli[b-crys2twceg]{font-size:13px;background:#f7f9fc;border:1px solid #e2e9f1;border-radius:9px;padding:10px 12px;margin:0 0 14px}
.sop-modal label[b-crys2twceg]{display:block;font-size:12px;color:#6b7a8d;margin-bottom:5px;font-weight:600}
.sop-modal-sel[b-crys2twceg]{width:100%;border:1px solid #dde5ee;border-radius:8px;padding:9px 10px;font-size:14px;background:#fbfdff}
.sop-modal-foot[b-crys2twceg]{display:flex;gap:8px;justify-content:flex-end;margin-top:18px}
.sop-empty[b-crys2twceg]{padding:30px;text-align:center;color:#6b7a8d;font-size:13.5px}
.sop-empty p[b-crys2twceg]{margin-top:10px;line-height:1.5}

/* ---- Cobertura (informativo) ---- */
.sop-mega[b-crys2twceg]{background:#fff;border:1px solid #e2e9f1;border-radius:12px;padding:14px 16px;margin:0 0 18px}
.sop-track[b-crys2twceg]{height:16px;border-radius:9px;background:#eef2f7;display:flex;overflow:hidden}
.sop-track i[b-crys2twceg]{display:block;height:100%}
.sop-track .s-ok[b-crys2twceg]{background:#1f9d55}.sop-track .s-rev[b-crys2twceg]{background:#e0a800}.sop-track .s-pend[b-crys2twceg]{background:#dde5ee}
.sop-leg[b-crys2twceg]{display:flex;gap:18px;margin-top:10px;font-size:12px;color:#6b7a8d;align-items:center}
.sop-leg b[b-crys2twceg]{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.sop-leg .b-ok[b-crys2twceg]{background:#1f9d55}.sop-leg .b-rev[b-crys2twceg]{background:#e0a800}.sop-leg .b-pend[b-crys2twceg]{background:#dde5ee}
.sop-leg-pct[b-crys2twceg]{margin-left:auto;font-weight:700;color:#1f4a87}
.sop-revisar[b-crys2twceg]{background:#fff8ec;border:1px solid #f0d9a8;border-left:4px solid #e0a800;border-radius:10px;padding:12px 15px;margin:0 0 18px}
.sop-revisar-h[b-crys2twceg]{display:flex;align-items:center;gap:8px;color:#9a6b00;font-size:13.5px}
.sop-revisar-h i[b-crys2twceg]{font-size:16px}
.sop-revisar-h span[b-crys2twceg]{color:#b08a3a;font-weight:400}
.sop-revisar ul[b-crys2twceg]{margin:8px 0 0;padding-left:22px}
.sop-revisar li[b-crys2twceg]{font-size:12.5px;margin:3px 0}
.sop-h3[b-crys2twceg]{font-size:14px;color:#1f4a87;margin:6px 0 10px}
.sop-mods[b-crys2twceg]{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.sop-mod[b-crys2twceg]{background:#fff;border:1px solid #e2e9f1;border-radius:11px;padding:12px 14px}
.sop-mod-top[b-crys2twceg]{display:flex;justify-content:space-between;align-items:baseline}
.sop-mod-top .name[b-crys2twceg]{font-weight:700;font-size:13px}
.sop-mod-top .cnt[b-crys2twceg]{font-size:12px;color:#6b7a8d}
.sop-mod-bar[b-crys2twceg]{height:8px;border-radius:5px;background:#eef2f7;margin-top:8px;overflow:hidden}
.sop-mod-bar i[b-crys2twceg]{display:block;height:100%;background:linear-gradient(90deg,#1f9d55,#36b56a)}
.sop-mod-pct[b-crys2twceg]{font-size:11px;color:#6b7a8d;margin-top:5px}

/* Título de sección (fase F — KPIs de eficacia + cobertura). */
.sop-seccion-t[b-crys2twceg]{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:#26405e;margin:6px 2px 10px}
.sop-seccion-t > i[b-crys2twceg]{color:#6e3fc0}
.sop-kpibar.efic .sop-kpi[b-crys2twceg]{background:#fff}
/* /Components/Seguimiento/TrabajosHistoricoPanel.razor.rz.scp.css */
/* TrabajosHistoricoPanel — listado plano del histórico de trabajos.
   - Header con chip de rango activo + presets que se iluminan
   - Grid sticky con filtros por columna
   - Footer canónico: contador "X de Y" + sumatorio reactivo + Máx. + Cargar todos
   - Loading overlay durante consultas servidor */

.th-page[b-b8ckqddnah] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    background: #f4f6fa;
    overflow: hidden;
    position: relative;
}

.th-head[b-b8ckqddnah] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 18px;
    background: linear-gradient(180deg, #ffffff 0%, #eef3fa 100%);
    border-bottom: 1px solid #d2dbe6;
    box-shadow: 0 1px 3px rgba(15, 30, 55, 0.06);
}

.th-head-title[b-b8ckqddnah] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #1f2c3d;
}

.th-head-title h2[b-b8ckqddnah] {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.2px;
}

.th-head-title i.bi-journals[b-b8ckqddnah] {
    font-size: 22px;
    color: #1f4a87;
}

.th-head-actions[b-b8ckqddnah] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Bloque del rango — chip destacado + inputs + presets */
.th-rango[b-b8ckqddnah] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid #c9ced4;
    border-radius: 8px;
    padding: 4px 10px 4px 6px;
    box-shadow: 0 1px 2px rgba(15, 30, 55, 0.04);
}

/* Chip del rango activo — siempre visible, dice de un vistazo qué se está
   viendo. Color "intenso" para que se distinga del resto del header. */
.th-rango-chip[b-b8ckqddnah] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: linear-gradient(180deg, #1f4a87 0%, #163a6f 100%);
    color: #fff;
    border-radius: 6px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    white-space: nowrap;
}

.th-rango-chip i[b-b8ckqddnah] {
    font-size: 13px;
    opacity: 0.9;
}

.th-rango-chip-text[b-b8ckqddnah] {
    display: inline-block;
}

.th-rango-sep[b-b8ckqddnah] {
    width: 1px;
    height: 22px;
    background: #d8dde4;
}

.th-rango-lbl[b-b8ckqddnah] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: #4a5566;
    font-weight: 600;
}

.th-rango-inp[b-b8ckqddnah] {
    border: 1px solid #c9ced4;
    border-radius: 4px;
    padding: 2px 6px;
    font-size: 12px;
    height: 24px;
    background: #fff;
    color: #1f2c3d;
    font-family: inherit;
}

.th-rango-inp:focus[b-b8ckqddnah] {
    outline: none;
    border-color: #3874cb;
    box-shadow: 0 0 0 1px #3874cb;
}

.th-rango-presets[b-b8ckqddnah] {
    display: flex;
    gap: 4px;
    margin-left: 6px;
    border-left: 1px solid #d8dde4;
    padding-left: 8px;
}

.th-rango-preset[b-b8ckqddnah] {
    background: #f4f7fb;
    border: 1px solid #c9d1de;
    color: #1f4a87;
    border-radius: 4px;
    padding: 3px 10px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}

.th-rango-preset:hover[b-b8ckqddnah] {
    background: #e6eef9;
    border-color: #1f4a87;
}

/* Preset activo — el que coincide con el rango actual. Estilo "pill"
   relleno del color corporativo. */
.th-rango-preset.active[b-b8ckqddnah] {
    background: linear-gradient(180deg, #2f6ec1 0%, #1f4a87 100%);
    border-color: #163a6f;
    color: #fff;
    box-shadow: 0 1px 2px rgba(31, 74, 135, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    cursor: default;
}

.th-rango-preset.active:hover[b-b8ckqddnah] {
    background: linear-gradient(180deg, #2f6ec1 0%, #1f4a87 100%);
}

.th-back[b-b8ckqddnah] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #fff;
    border: 1px solid #c9d1de;
    color: #1f4a87;
    border-radius: 6px;
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.th-back:hover[b-b8ckqddnah] {
    background: #eef3fa;
    border-color: #1f4a87;
}

.th-body[b-b8ckqddnah] {
    flex: 1 1 auto;
    overflow: auto;
    background: #fff;
    margin: 8px 12px 0;
    border: 1px solid #d8dde4;
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(15, 30, 55, 0.05);
}

.th-grid[b-b8ckqddnah] {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    color: #1f2c3d;
}

.th-grid thead[b-b8ckqddnah] {
    position: sticky;
    top: 0;
    z-index: 5;
    background: #fff;
}

.th-grid thead tr:first-child th[b-b8ckqddnah] {
    background: linear-gradient(180deg, #f6f9fd 0%, #e6eef9 100%);
    border-bottom: 1px solid #c5cdd9;
    padding: 0;
    text-align: left;
    font-weight: 700;
    color: #1f2c3d;
    white-space: nowrap;
}

.th-sort[b-b8ckqddnah] {
    background: transparent;
    border: none;
    color: inherit;
    font: inherit;
    text-align: left;
    padding: 6px 10px;
    width: 100%;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.th-sort:hover[b-b8ckqddnah] {
    background: #d8e6f6;
}

.th-sort-idle[b-b8ckqddnah] {
    color: #9aa4b3;
    font-size: 11px;
}

.th-sort-active[b-b8ckqddnah] {
    color: #1f4a87;
    font-size: 12px;
}

.th-grid-filter-row th[b-b8ckqddnah] {
    background: #fbfcfe;
    border-bottom: 1px solid #d8dde4;
    padding: 3px 4px;
}

.th-grid-filter-inp[b-b8ckqddnah] {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #c9ced4;
    border-radius: 3px;
    padding: 2px 6px;
    font-size: 11px;
    color: #1f2c3d;
    background: #fff;
}

.th-grid-filter-inp:focus[b-b8ckqddnah] {
    outline: none;
    border-color: #3874cb;
    box-shadow: 0 0 0 1px #3874cb;
}

.th-filter-mini[b-b8ckqddnah] {
    width: 36px !important;
    text-align: center;
}

.th-grid tbody tr[b-b8ckqddnah] {
    border-bottom: 1px solid #eef1f6;
    cursor: pointer;
    transition: background 0.1s;
}

.th-grid tbody tr:hover[b-b8ckqddnah] {
    background: #f4f8fd;
}

.th-grid tbody td[b-b8ckqddnah] {
    padding: 5px 10px;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 0;
}

.th-col-fecha[b-b8ckqddnah]    { width: 120px; }
.th-col-tipo[b-b8ckqddnah]     { width: 38px; text-align: center; }
.th-col-prog[b-b8ckqddnah]     { width: 130px; }
.th-col-cli[b-b8ckqddnah]      { width: 140px; }
.th-col-proy[b-b8ckqddnah]     { width: 160px; }
.th-col-cat[b-b8ckqddnah]      { width: 100px; }
.th-col-tobj[b-b8ckqddnah]     { width: 80px; }
.th-col-objeto[b-b8ckqddnah]   { width: 200px; }
.th-col-estado[b-b8ckqddnah]   { width: 110px; }
.th-col-min[b-b8ckqddnah]      { width: 50px; text-align: right; }
.th-col-com[b-b8ckqddnah]      { width: auto; min-width: 200px; }

.th-com-short[b-b8ckqddnah] {
    color: #4a5566;
    font-size: 11.5px;
}

.th-empty-row td[b-b8ckqddnah] {
    padding: 32px 16px !important;
    text-align: center;
    background: #fafbfd;
}

.th-empty[b-b8ckqddnah] {
    color: #6c7787;
}

.th-empty i[b-b8ckqddnah] {
    font-size: 32px;
    color: #b9c1cd;
    display: block;
    margin-bottom: 8px;
}

.th-empty p[b-b8ckqddnah] {
    margin: 0 0 8px 0;
    font-size: 13px;
}

.th-clear-link[b-b8ckqddnah] {
    background: none;
    border: 1px solid #c9d1de;
    color: #1f4a87;
    padding: 4px 12px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
}

.th-clear-link:hover[b-b8ckqddnah] {
    background: #eef3fa;
}

/* === Footer canónico — paginación + sumatorio reactivo === */
.th-bottom-bar[b-b8ckqddnah] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: linear-gradient(180deg, #f6f9fd 0%, #eef3fa 100%);
    border-top: 1px solid #d2dbe6;
    margin: 0 12px 12px;
    border-radius: 0 0 6px 6px;
    box-shadow: 0 -1px 3px rgba(15, 30, 55, 0.04);
    min-height: 38px;
}

.th-counter[b-b8ckqddnah] {
    font-size: 12px;
    color: #4a5566;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.th-counter-hint[b-b8ckqddnah] {
    color: #b06900;
    font-style: italic;
    margin-left: 6px;
    font-size: 11px;
}

.th-sep[b-b8ckqddnah] {
    color: #c5cdd9;
    font-weight: 700;
    margin: 0 4px;
}

/* Sumatorio reactivo: lo que el revisor está mirando, en horas. */
.th-sumatorio[b-b8ckqddnah] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #fff8d0;
    border: 1px solid #e0d090;
    border-radius: 5px;
    padding: 3px 10px;
    font-size: 12px;
    color: #856e1e;
}

.th-sumatorio i[b-b8ckqddnah] {
    color: #b09600;
    font-size: 13px;
}

.th-sumatorio strong[b-b8ckqddnah] {
    color: #5a4a10;
    font-size: 13px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.th-sumatorio-detail[b-b8ckqddnah] {
    color: #6e5a1c;
    font-size: 11px;
    font-style: italic;
}

.th-spacer[b-b8ckqddnah] { flex: 1 1 auto; }

.th-max-lbl[b-b8ckqddnah] {
    font-size: 11px;
    color: #4a5566;
    white-space: nowrap;
    font-weight: 600;
}

.th-max-inp[b-b8ckqddnah] {
    width: 70px;
    height: 26px;
    padding: 2px 6px;
    border: 1px solid #c9ced4;
    border-radius: 3px;
    font-size: 12px;
    text-align: right;
    background: #fff;
    color: #1f2c3d;
    font-variant-numeric: tabular-nums;
}

.th-max-inp:focus[b-b8ckqddnah] {
    outline: none;
    border-color: #3874cb;
    box-shadow: 0 0 0 1px #3874cb;
}

.th-max-inp[b-b8ckqddnah]::-webkit-outer-spin-button,
.th-max-inp[b-b8ckqddnah]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.th-max-inp[b-b8ckqddnah] {
    -moz-appearance: textfield;
    appearance: textfield;
}

.th-cargar-todos[b-b8ckqddnah] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 26px;
    padding: 2px 12px;
    border: 1px solid #b6d0ea;
    background: #eaf2fb;
    color: #1f4a87;
    font-size: 11px;
    font-weight: 600;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
}

.th-cargar-todos:hover[b-b8ckqddnah] {
    background: #d6e6f7;
    border-color: #8fb3da;
}

.th-cargar-todos:disabled[b-b8ckqddnah] {
    opacity: 0.55;
    cursor: not-allowed;
}

.th-cargar-todos i[b-b8ckqddnah] {
    font-size: 13px;
    color: #1f4a87;
}

/* === Loading overlay durante consulta servidor === */
.th-loading-overlay[b-b8ckqddnah] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.55);
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.th-loading-overlay *[b-b8ckqddnah] { cursor: wait; }

.th-loading-card[b-b8ckqddnah] {
    background: #fff;
    border: 1px solid #b6d0ea;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.20);
    padding: 16px 22px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    color: #1f3147;
    font-weight: 600;
}

.th-loading-card .th-spin[b-b8ckqddnah] {
    font-size: 20px;
    color: #2a55a3;
    animation: th-spin-b-b8ckqddnah 0.9s linear infinite;
}

@keyframes th-spin-b-b8ckqddnah {
    to { transform: rotate(360deg); }
}

/* Responsive */
@media (max-width: 1280px) {
    .th-rango-presets[b-b8ckqddnah] { display: none; }
    .th-sumatorio-detail[b-b8ckqddnah] { display: none; }
}
/* /Components/Soporte/SoporteCentro.razor.rz.scp.css */
/* Centro de Soporte — landing dedicada (fase C). Overlay centrado sobre el shell. */
.soc-backdrop[b-rwl0j8e98g]{position:fixed;inset:0;background:rgba(15,27,45,.55);z-index:1400;animation:socfade-b-rwl0j8e98g .15s ease}
@keyframes socfade-b-rwl0j8e98g{from{opacity:0}to{opacity:1}}

.soc-panel[b-rwl0j8e98g]{position:fixed;z-index:1401;left:50%;top:64px;transform:translateX(-50%);
    width:min(980px,94vw);max-height:calc(100vh - 90px);
    background:#f4f7fb;border:1px solid #d6e0ec;border-radius:18px;box-shadow:0 30px 80px rgba(15,27,45,.45);
    display:flex;flex-direction:column;overflow:hidden;font-family:"Segoe UI",system-ui,sans-serif;animation:socpop-b-rwl0j8e98g .18s ease}
@keyframes socpop-b-rwl0j8e98g{from{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%,0)}}

.soc-head[b-rwl0j8e98g]{background:linear-gradient(135deg,#6e3fc0,#2f5fb0);color:#fff;padding:16px 20px;display:flex;align-items:center;gap:13px}
.soc-head-ic[b-rwl0j8e98g]{width:42px;height:42px;border-radius:13px;background:rgba(255,255,255,.18);display:grid;place-items:center;font-size:22px;flex:0 0 auto}
.soc-head-txt b[b-rwl0j8e98g]{font-size:17px;display:block;line-height:1.2}
.soc-head-txt small[b-rwl0j8e98g]{font-size:12.5px;opacity:.92}
.soc-x[b-rwl0j8e98g]{margin-left:auto;background:rgba(255,255,255,.14);border:0;color:#fff;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;cursor:pointer;font-size:15px}
.soc-x:hover[b-rwl0j8e98g]{background:rgba(255,255,255,.26)}

.soc-body[b-rwl0j8e98g]{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:22px}

/* ===== 4 formas de resolver ===== */
.soc-ways[b-rwl0j8e98g]{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.soc-way[b-rwl0j8e98g]{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;text-decoration:none;cursor:pointer;
    background:#fff;border:1px solid #e3eaf3;border-radius:16px;padding:18px;font-family:inherit;
    box-shadow:0 2px 6px rgba(20,34,52,.06);transition:transform .14s,box-shadow .14s,border-color .14s}
.soc-way:hover[b-rwl0j8e98g]{transform:translateY(-2px);box-shadow:0 10px 26px rgba(20,34,52,.14)}
.soc-way-ic[b-rwl0j8e98g]{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;font-size:22px;color:#fff;margin-bottom:4px}
.soc-way.chat .soc-way-ic[b-rwl0j8e98g]{background:linear-gradient(135deg,#6e3fc0,#2f5fb0)}
.soc-way.video .soc-way-ic[b-rwl0j8e98g]{background:linear-gradient(135deg,#2f6fd0,#1f4a87)}
.soc-way.guia .soc-way-ic[b-rwl0j8e98g]{background:linear-gradient(135deg,#e0962f,#c8761a)}
.soc-way.canal .soc-way-ic[b-rwl0j8e98g]{background:linear-gradient(135deg,#25d366,#0f9d4f)}
.soc-way-ttl[b-rwl0j8e98g]{font-size:15.5px;font-weight:700;color:#1c2b3a}
.soc-way-sub[b-rwl0j8e98g]{font-size:12.8px;color:#5d7088;line-height:1.45}
.soc-way-cta[b-rwl0j8e98g]{margin-top:6px;font-size:12.5px;font-weight:700;color:#6e3fc0;display:inline-flex;align-items:center;gap:6px}

/* ===== Secciones ===== */
.soc-sec h3[b-rwl0j8e98g]{font-size:14.5px;font-weight:800;color:#26405e;margin:0 0 12px;display:flex;align-items:center;gap:8px}
.soc-sec h3 > i[b-rwl0j8e98g]{color:#6e3fc0}

/* Guías disponibles (copiloto) */
.soc-guias[b-rwl0j8e98g]{display:flex;flex-direction:column;gap:9px}
.soc-guia[b-rwl0j8e98g]{display:flex;align-items:center;gap:11px;cursor:pointer;background:#fff;border:1px solid #ecdcc2;border-radius:13px;
    padding:13px 15px;font-size:13.5px;font-weight:600;color:#7a4d0f;font-family:inherit;box-shadow:0 1px 3px rgba(200,118,26,.1)}
.soc-guia:hover[b-rwl0j8e98g]{background:#fff7ec;border-color:#e0a85a}
.soc-guia > i:first-child[b-rwl0j8e98g]{font-size:18px;color:#c8761a}
.soc-guia > span[b-rwl0j8e98g]{flex:1;text-align:left}
.soc-guia > i:last-child[b-rwl0j8e98g]{color:#c8761a;font-size:18px}

/* ===== Historial "lo que preguntaste" ===== */
.soc-hist-vacio[b-rwl0j8e98g]{display:flex;align-items:center;gap:10px;background:#fff;border:1px dashed #d6e0ec;border-radius:13px;
    padding:18px;color:#7a8aa0;font-size:13px}
.soc-hist-vacio > i[b-rwl0j8e98g]{font-size:20px;color:#b6c3d4}
.soc-spin[b-rwl0j8e98g]{animation:socspin-b-rwl0j8e98g 1s linear infinite;display:inline-block}
@keyframes socspin-b-rwl0j8e98g{to{transform:rotate(360deg)}}
.soc-hist[b-rwl0j8e98g]{display:flex;flex-direction:column;gap:9px}
.soc-hi[b-rwl0j8e98g]{background:#fff;border:1px solid #e3eaf3;border-radius:13px;overflow:hidden}
.soc-hi-head[b-rwl0j8e98g]{display:flex;align-items:center;gap:11px;padding:12px 14px;cursor:pointer}
.soc-hi-head:hover[b-rwl0j8e98g]{background:#fafcff}
.soc-hi-canal[b-rwl0j8e98g]{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:14px;color:#fff;flex:0 0 auto;background:#7f8a9b}
.soc-canal-tapiz[b-rwl0j8e98g]{background:linear-gradient(135deg,#6e3fc0,#2f5fb0)}
.soc-canal-email[b-rwl0j8e98g]{background:linear-gradient(135deg,#2f6fd0,#1f4a87)}
.soc-canal-whatsapp[b-rwl0j8e98g]{background:linear-gradient(135deg,#25d366,#0f9d4f)}
.soc-canal-voz[b-rwl0j8e98g]{background:linear-gradient(135deg,#6e7c8d,#505b68)}
.soc-hi-q[b-rwl0j8e98g]{flex:1;font-size:13.5px;font-weight:600;color:#1c2b3a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.soc-hi-estado[b-rwl0j8e98g]{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;border-radius:7px;padding:3px 8px;white-space:nowrap;flex:0 0 auto}
.soc-est-ia_resuelta[b-rwl0j8e98g],.soc-est-cerrada[b-rwl0j8e98g]{background:#e3f7ea;color:#0f7a3d}
.soc-est-escalada[b-rwl0j8e98g],.soc-est-en_curso[b-rwl0j8e98g]{background:#fdeede;color:#9a6b00}
.soc-est-nueva[b-rwl0j8e98g]{background:#eef2f7;color:#7a8aa0}
.soc-hi-chev[b-rwl0j8e98g]{color:#b6c3d4;font-size:12px}
.soc-hi-body[b-rwl0j8e98g]{padding:0 14px 14px;border-top:1px solid #eef3f8}
.soc-hi-resp[b-rwl0j8e98g]{font-size:13px;color:#2a3b4d;line-height:1.55;padding-top:12px}
.soc-hi-resp.pend[b-rwl0j8e98g]{color:#9a6b00;font-style:italic}
.soc-hi-quien[b-rwl0j8e98g]{display:inline-block;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;
    background:#eef2f7;color:#5d7088;border-radius:6px;padding:2px 7px;margin-right:8px;vertical-align:middle}
.soc-hi-quien.ia[b-rwl0j8e98g]{background:#efeafb;color:#6e3fc0}
.soc-hi-val[b-rwl0j8e98g]{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:12px;color:#7a8aa0}
.soc-val[b-rwl0j8e98g]{cursor:pointer;border:1px solid #dbe4ef;background:#fff;color:#7a8aa0;border-radius:9px;width:32px;height:30px;display:grid;place-items:center;font-size:13px}
.soc-val:hover[b-rwl0j8e98g]{border-color:#6e3fc0;color:#6e3fc0}
.soc-val.on[b-rwl0j8e98g]{background:#e3f7ea;border-color:#9bd9b3;color:#0f7a3d}
.soc-val.no.on[b-rwl0j8e98g]{background:#fde7e7;border-color:#e8b4b4;color:#c0392b}

/* ===== Canales ===== */
.soc-canales[b-rwl0j8e98g]{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.soc-canal-card[b-rwl0j8e98g]{display:flex;align-items:center;gap:12px;text-decoration:none;background:#fff;border:1px solid #e3eaf3;
    border-radius:14px;padding:14px;box-shadow:0 1px 3px rgba(20,34,52,.05);transition:transform .12s,box-shadow .12s}
.soc-canal-card:hover[b-rwl0j8e98g]{transform:translateY(-1px);box-shadow:0 6px 16px rgba(20,34,52,.13)}
.soc-cc-ic[b-rwl0j8e98g]{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:19px;color:#fff;flex:0 0 auto}
.soc-canal-card.correo .soc-cc-ic[b-rwl0j8e98g]{background:linear-gradient(135deg,#2f6fd0,#1f4a87)}
.soc-canal-card.wa .soc-cc-ic[b-rwl0j8e98g]{background:linear-gradient(135deg,#25d366,#0f9d4f)}
.soc-canal-card.tel .soc-cc-ic[b-rwl0j8e98g]{background:linear-gradient(135deg,#6e7c8d,#505b68)}
.soc-canal-card b[b-rwl0j8e98g]{font-size:14px;color:#1c2b3a;display:block}
.soc-canal-card small[b-rwl0j8e98g]{font-size:12px;color:#64778e}

@media (max-width:760px){
    .soc-ways[b-rwl0j8e98g]{grid-template-columns:1fr}
    .soc-canales[b-rwl0j8e98g]{grid-template-columns:1fr}
}
/* /Components/Soporte/SoporteChatWidget.razor.rz.scp.css */
/* Widget de chat de Soporte — panel grande anclado a la derecha (el lanzador
   es el botón 🎧 de la barra del shell). Diseño tipo "Análisis IA": el chat es
   la zona protagonista, con sugerencias de preguntas; los contactos van abajo
   en un panel plegable. */
.scw[b-f1ahduv062]{position:fixed;right:14px;top:54px;bottom:14px;z-index:1300;font-family:"Segoe UI",system-ui,sans-serif}

.scw-panel[b-f1ahduv062]{position:absolute;right:0;top:0;bottom:0;width:min(480px,94vw);
    background:#fff;border:1px solid #dde5ee;border-radius:18px;box-shadow:0 24px 70px rgba(20,34,52,.34);
    display:flex;flex-direction:column;overflow:hidden;animation:scwpop-b-f1ahduv062 .16s ease}
@keyframes scwpop-b-f1ahduv062{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* ===== Cabecera ===== */
.scw-head[b-f1ahduv062]{background:linear-gradient(135deg,#6e3fc0,#2f5fb0);color:#fff;padding:13px 16px;display:flex;align-items:center;gap:11px}
.scw-head-ic[b-f1ahduv062]{width:34px;height:34px;border-radius:11px;background:rgba(255,255,255,.18);display:grid;place-items:center;font-size:18px;flex:0 0 auto}
.scw-head-txt b[b-f1ahduv062]{font-size:15px;display:block;line-height:1.2}
.scw-head-txt small[b-f1ahduv062]{font-size:11.5px;opacity:.9}
.scw-x[b-f1ahduv062]{margin-left:auto;background:rgba(255,255,255,.12);border:0;color:#fff;cursor:pointer;font-size:14px;
    width:30px;height:30px;border-radius:9px;display:grid;place-items:center;opacity:.92}
.scw-x:hover[b-f1ahduv062]{opacity:1;background:rgba(255,255,255,.24)}

/* ===== Cuerpo del chat ===== */
.scw-body[b-f1ahduv062]{flex:1;overflow-y:auto;padding:16px 14px;background:#f4f7fb;display:flex;flex-direction:column;gap:13px}
.scw-row[b-f1ahduv062]{display:flex;align-items:flex-start;gap:9px;max-width:100%}
.scw-row.yo[b-f1ahduv062]{flex-direction:row-reverse}
.scw-av[b-f1ahduv062]{flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:15px;color:#fff;
    background:linear-gradient(135deg,#6e3fc0,#2f5fb0);box-shadow:0 1px 3px rgba(20,34,52,.18)}
.scw-av.yo[b-f1ahduv062]{background:linear-gradient(135deg,#7f8a9b,#5c6776)}
.scw-msg[b-f1ahduv062]{max-width:80%;padding:10px 13px;border-radius:14px;font-size:13.8px;line-height:1.5;box-shadow:0 1px 2px rgba(20,34,52,.08)}
.scw-msg.ia[b-f1ahduv062]{background:#fff;border-top-left-radius:4px;color:#1c2b3a}
.scw-msg.yo[b-f1ahduv062]{background:linear-gradient(135deg,#e7f1ff,#dcecff);border-top-right-radius:4px;color:#10314f}
.scw-msg.pensando[b-f1ahduv062]{color:#8aa0b6;font-style:italic;display:inline-flex;align-items:center;gap:7px}
.scw-msg strong[b-f1ahduv062]{font-weight:700}
.scw-esc[b-f1ahduv062]{color:#9a6b00;font-weight:600}
.scw-spin[b-f1ahduv062]{animation:scwspin-b-f1ahduv062 1s linear infinite;display:inline-block}
@keyframes scwspin-b-f1ahduv062{to{transform:rotate(360deg)}}

/* Acciones agénticas: botones que la IA propone bajo su respuesta. */
.scw-acciones[b-f1ahduv062]{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.scw-accion[b-f1ahduv062]{display:inline-flex;align-items:center;gap:6px;cursor:pointer;border:0;border-radius:10px;padding:8px 13px;
    font-size:12.5px;font-weight:600;line-height:1;font-family:inherit;box-shadow:0 1px 2px rgba(20,34,52,.12);
    transition:filter .12s,transform .12s}
.scw-accion > i[b-f1ahduv062]{font-size:14px}
.scw-accion:hover[b-f1ahduv062]{filter:brightness(1.04);transform:translateY(-1px)}
.scw-accion:active[b-f1ahduv062]{transform:none}
.scw-accion.abrir_form[b-f1ahduv062]{background:linear-gradient(135deg,#6e3fc0,#2f5fb0);color:#fff}
.scw-accion.video[b-f1ahduv062]{background:#eaf1fc;color:#1f4a87;border:1px solid #d4e3fa}

/* Sugerencias de arranque (tarjetas) — cuando el chat está recién abierto. */
.scw-sug-intro[b-f1ahduv062]{margin-top:2px}
.scw-sug-lbl[b-f1ahduv062]{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#6e3fc0;margin:2px 0 9px 2px}
.scw-sug-grid[b-f1ahduv062]{display:flex;flex-direction:column;gap:8px}
.scw-sug-card[b-f1ahduv062]{display:flex;align-items:center;gap:9px;text-align:left;cursor:pointer;width:100%;
    background:#fff;border:1px solid #e2e9f2;border-radius:12px;padding:11px 13px;font-size:13px;font-weight:600;
    color:#26405e;font-family:inherit;box-shadow:0 1px 2px rgba(20,34,52,.05);transition:transform .12s,box-shadow .12s,border-color .12s}
.scw-sug-card > i[b-f1ahduv062]{color:#6e3fc0;font-size:15px;flex:0 0 auto}
.scw-sug-card:hover[b-f1ahduv062]{transform:translateY(-1px);box-shadow:0 5px 14px rgba(110,63,192,.16);border-color:#cdbcf0}
.scw-sug-card:disabled[b-f1ahduv062]{opacity:.5;cursor:default}

/* Chips "sigue preguntando" — fila compacta sobre el input. */
.scw-sugeridas[b-f1ahduv062]{display:flex;align-items:center;gap:7px;overflow-x:auto;padding:9px 12px;
    border-top:1px solid #eef3f8;background:#fbfcfe;scrollbar-width:thin}
.scw-sug-lbl2[b-f1ahduv062]{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:#8a93a0;white-space:nowrap;flex:0 0 auto}
.scw-sug-lbl2 > i[b-f1ahduv062]{color:#e0a800}
.scw-chip[b-f1ahduv062]{flex:0 0 auto;white-space:nowrap;cursor:pointer;border:1px solid #dbe4ef;background:#fff;color:#3a5170;
    border-radius:999px;padding:5px 11px;font-size:11.5px;font-weight:600;font-family:inherit;transition:background .12s,border-color .12s}
.scw-chip:hover[b-f1ahduv062]{background:#f0ecfb;border-color:#cdbcf0;color:#5a32a3}
.scw-chip:disabled[b-f1ahduv062]{opacity:.5;cursor:default}

/* Input del chat. */
.scw-input[b-f1ahduv062]{display:flex;gap:9px;padding:11px 12px;border-top:1px solid #e2e9f1;background:#fff}
.scw-input input[b-f1ahduv062]{flex:1;border:1px solid #dde5ee;border-radius:11px;padding:11px 13px;font-size:14px;outline:none;font-family:inherit}
.scw-input input:focus[b-f1ahduv062]{border-color:#6e3fc0;box-shadow:0 0 0 3px rgba(110,63,192,.12)}
.scw-input button[b-f1ahduv062]{border:0;background:#6e3fc0;color:#fff;border-radius:11px;width:46px;cursor:pointer;font-size:16px;flex:0 0 auto}
.scw-input button:hover[b-f1ahduv062]{background:#5a32a3}
.scw-input button:disabled[b-f1ahduv062]{opacity:.5;cursor:wait}

/* ===== Otras vías de contacto (panel plegable, abajo) ===== */
.scw-vias[b-f1ahduv062]{border-top:1px solid #e7edf5;background:#f7f9fd}
.scw-vias-head[b-f1ahduv062]{width:100%;display:flex;align-items:center;gap:8px;cursor:pointer;border:0;background:transparent;
    padding:11px 14px;font-family:inherit;color:#3a5170;font-size:12.5px;font-weight:700}
.scw-vias-head > i:first-child[b-f1ahduv062]{font-size:14px;color:#6e3fc0}
.scw-vias-ttl[b-f1ahduv062]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scw-vias-mini[b-f1ahduv062]{margin-left:auto;display:inline-flex;gap:7px;color:#9fb0c6;font-size:13px}
.scw-vias.open .scw-vias-mini[b-f1ahduv062]{display:none}
.scw-vias-chev[b-f1ahduv062]{color:#9fb0c6;font-size:11px}
.scw-vias-head:hover[b-f1ahduv062]{color:#1c2b3a}
.scw-vias-head:hover .scw-vias-chev[b-f1ahduv062]{color:#6e3fc0}

.scw-vias-list[b-f1ahduv062]{display:flex;flex-direction:column;gap:8px;padding:2px 12px 12px}
.scw-via[b-f1ahduv062]{display:flex;align-items:center;gap:12px;text-decoration:none;border-radius:13px;padding:10px 12px;background:#fff;
    border:1px solid #e7edf5;box-shadow:0 1px 2px rgba(20,34,52,.05);transition:transform .12s,box-shadow .12s}
a.scw-via:hover[b-f1ahduv062]{transform:translateY(-1px);box-shadow:0 5px 14px rgba(20,34,52,.13)}
.scw-via-ic[b-f1ahduv062]{flex:0 0 auto;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-size:17px;color:#fff}
.scw-via-txt[b-f1ahduv062]{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.scw-via-txt b[b-f1ahduv062]{font-size:13.5px;color:#1c2b3a}
.scw-via-txt small[b-f1ahduv062]{font-size:12px;color:#64778e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scw-via-go[b-f1ahduv062]{margin-left:auto;color:#b6c3d4;font-size:14px}
a.scw-via:hover .scw-via-go[b-f1ahduv062]{color:#6e3fc0}
.scw-via.correo .scw-via-ic[b-f1ahduv062]{background:linear-gradient(135deg,#2f6fd0,#1f4a87)}
.scw-via.wa .scw-via-ic[b-f1ahduv062]{background:linear-gradient(135deg,#25d366,#0f9d4f)}
.scw-via.tel .scw-via-ic[b-f1ahduv062]{background:linear-gradient(135deg,#6e7c8d,#505b68)}
/* /Components/ValidacionCritica/ValidacionCriticaPanel.razor.rz.scp.css */
/* ValidacionCriticaPanel — añadidos sobre la base existente en app.css.
   Mismo patrón visual que TrabajosHistoricoPanel:
   - Header con chip de rango activo + presets que se iluminan (vista histórico).
   - Sort por columna (botón en thead).
   - Footer canónico: contador "X de Y" + sumatorio reactivo + Máx. + Cargar todos.
   - Loading overlay durante consulta servidor.
   Las clases base .vc-page / .vc-head / .vc-grid / .vc-pill / etc. siguen
   en netoffice_shell/wwwroot/app.css — aquí sólo añado las piezas nuevas. */

/* === Bloque del rango — chip destacado + inputs + presets ============== */

.vc-rango[b-62r861nams] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid #c9ced4;
    border-radius: 8px;
    padding: 4px 10px 4px 6px;
    box-shadow: 0 1px 2px rgba(15, 30, 55, 0.04);
}

.vc-rango-chip[b-62r861nams] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: linear-gradient(180deg, #1f4a87 0%, #163a6f 100%);
    color: #fff;
    border-radius: 6px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    white-space: nowrap;
}

.vc-rango-chip i[b-62r861nams] {
    font-size: 13px;
    opacity: 0.9;
}

.vc-rango-chip-text[b-62r861nams] { display: inline-block; }

.vc-rango-sep[b-62r861nams] {
    width: 1px;
    height: 22px;
    background: #d8dde4;
}

.vc-rango-lbl[b-62r861nams] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: #4a5566;
    font-weight: 600;
}

.vc-rango-inp[b-62r861nams] {
    border: 1px solid #c9ced4;
    border-radius: 4px;
    padding: 2px 6px;
    font-size: 12px;
    height: 24px;
    background: #fff;
    color: #1f2c3d;
    font-family: inherit;
}

.vc-rango-inp:focus[b-62r861nams] {
    outline: none;
    border-color: #3874cb;
    box-shadow: 0 0 0 1px #3874cb;
}

.vc-rango-presets[b-62r861nams] {
    display: flex;
    gap: 4px;
    margin-left: 6px;
    border-left: 1px solid #d8dde4;
    padding-left: 8px;
}

.vc-rango-preset[b-62r861nams] {
    background: #f4f7fb;
    border: 1px solid #c9d1de;
    color: #1f4a87;
    border-radius: 4px;
    padding: 3px 10px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}

.vc-rango-preset:hover[b-62r861nams] {
    background: #e6eef9;
    border-color: #1f4a87;
}

.vc-rango-preset.active[b-62r861nams] {
    background: linear-gradient(180deg, #2f6ec1 0%, #1f4a87 100%);
    border-color: #163a6f;
    color: #fff;
    box-shadow: 0 1px 2px rgba(31, 74, 135, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.18);
    cursor: default;
}

.vc-rango-preset.active:hover[b-62r861nams] {
    background: linear-gradient(180deg, #2f6ec1 0%, #1f4a87 100%);
}

/* === Sort por columna ================================================== */
/* Reemplaza el thead estático del panel — el botón abarca toda la celda
   para que el área clickable sea grande. */

.vc-grid thead th[b-62r861nams] {
    padding: 0;          /* el .vc-th-sort aporta padding 6px 10px */
}

.vc-th-sort[b-62r861nams] {
    background: transparent;
    border: none;
    color: inherit;
    font: inherit;
    text-align: left;
    padding: 6px 10px;
    width: 100%;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-weight: 600;
}

.vc-th-sort:hover[b-62r861nams] { background: #d8e6f6; }

.vc-sort-idle[b-62r861nams] {
    color: #9aa4b3;
    font-size: 11px;
}

.vc-sort-active[b-62r861nams] {
    color: #1f4a87;
    font-size: 12px;
}

/* === Footer canónico — paginación + sumatorio reactivo ================ */

.vc-bottom-bar[b-62r861nams] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: linear-gradient(180deg, #f6f9fd 0%, #eef3fa 100%);
    border: 1px solid #c5cdd9;
    border-radius: 6px;
    box-shadow: 0 -1px 3px rgba(15, 30, 55, 0.04);
    min-height: 38px;
    flex-wrap: wrap;
    /* El padre .vc-page ya tiene gap (12px); no margin extra. */
}

.vc-counter-bottom[b-62r861nams] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #4a5566;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.vc-counter-bottom i[b-62r861nams] { color: #1f4a87; font-size: 13px; }
.vc-counter-bottom strong[b-62r861nams] { color: #1f2c3d; font-weight: 800; }

.vc-counter-hint[b-62r861nams] {
    color: #b06900;
    font-style: italic;
    margin-left: 6px;
    font-size: 11px;
}

.vc-bottom-sep[b-62r861nams] {
    color: #c5cdd9;
    font-weight: 700;
    margin: 0 4px;
}

/* Sumatorio reactivo — desglose por estado del TOTAL real (no de las filas
   visibles). Cada pill replica el color del .vc-pill correspondiente para
   que el ojo enlace inmediatamente con la columna Estado del grid. */
.vc-sumatorio[b-62r861nams] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.vc-sum-pill[b-62r861nams] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 2px 8px;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    font-variant-numeric: tabular-nums;
}

.vc-sum-p[b-62r861nams] { background: #d6850c; }
.vc-sum-a[b-62r861nams] { background: #1d6f42; }
.vc-sum-r[b-62r861nams] { background: #c62828; }
.vc-sum-x[b-62r861nams] { background: #6c757d; }

.vc-sum-detail[b-62r861nams] {
    color: #6e7787;
    font-size: 11px;
    font-style: italic;
    margin-left: 4px;
}

.vc-bottom-spacer[b-62r861nams] { flex: 1 1 auto; }

.vc-max-lbl[b-62r861nams] {
    font-size: 11px;
    color: #4a5566;
    white-space: nowrap;
    font-weight: 600;
}

.vc-max-inp[b-62r861nams] {
    width: 70px;
    height: 26px;
    padding: 2px 6px;
    border: 1px solid #c9ced4;
    border-radius: 3px;
    font-size: 12px;
    text-align: right;
    background: #fff;
    color: #1f2c3d;
    font-variant-numeric: tabular-nums;
}

.vc-max-inp:focus[b-62r861nams] {
    outline: none;
    border-color: #3874cb;
    box-shadow: 0 0 0 1px #3874cb;
}

/* CLAUDE.md §2.9 — sin chevrones nativos en input number. */
.vc-max-inp[b-62r861nams]::-webkit-outer-spin-button,
.vc-max-inp[b-62r861nams]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.vc-max-inp[b-62r861nams] {
    -moz-appearance: textfield;
    appearance: textfield;
}

.vc-cargar-todos[b-62r861nams] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 26px;
    padding: 2px 12px;
    border: 1px solid #b6d0ea;
    background: #eaf2fb;
    color: #1f4a87;
    font-size: 11px;
    font-weight: 600;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
}

.vc-cargar-todos:hover[b-62r861nams] {
    background: #d6e6f7;
    border-color: #8fb3da;
}

.vc-cargar-todos:disabled[b-62r861nams] {
    opacity: 0.55;
    cursor: not-allowed;
}

.vc-cargar-todos i[b-62r861nams] {
    font-size: 13px;
    color: #1f4a87;
}

/* === Loading overlay durante consulta servidor ======================== */

.vc-loading-overlay[b-62r861nams] {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.55);
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.vc-loading-overlay *[b-62r861nams] { cursor: wait; }

.vc-loading-card[b-62r861nams] {
    background: #fff;
    border: 1px solid #b6d0ea;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.20);
    padding: 16px 22px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    color: #1f3147;
    font-weight: 600;
}

.vc-loading-card .vc-spin[b-62r861nams] {
    font-size: 20px;
    color: #2a55a3;
    animation: vc-spin-b-62r861nams 0.9s linear infinite;
}

@keyframes vc-spin-b-62r861nams {
    to { transform: rotate(360deg); }
}

/* === Responsive — el panel vive en el shell con sidebar; cuando el ancho
   se aprieta colapsamos los presets y el detalle del sumatorio. =========== */
@media (max-width: 1280px) {
    .vc-rango-presets[b-62r861nams] { display: none; }
    .vc-sum-detail[b-62r861nams] { display: none; }
}